按输入值更改图像的功能
因为s不容易定制,所以我使用一个图像来替换一个带有隐藏输入的复选框来存储值.我想要三个选项(0,1或2),我希望用户能够再次单击复选框以选择第二个选项,然后第三次单击将再次取消选择它.
我以前用过的函数,它起作用了,所以我不明白为什么这次不是.有谁能帮帮我吗?
这是功能:
选择 | 换行 | 行号
- function change_image($div_name, $hidden_name)
- {
- var $check=document.getElementById($hidden_name).value;
- if ($check==0)
- {
- document.getElementById($div_name).innerHTML="<img alt='' src='icons/no_tick.png' onmouseover=\"this.src='icons/tick_select.png'; this.style.cursor='hand';\" onmouseout=\"this.src='icons/no_tick.png'\" onclick=\"document.forms.forms_manager."+$hidden_name+".value='1'; javascript :change_image('"+$div_name+"', '"+$hidden_name+"');\">";
- }
- else if($check==1)
- {
- document.getElementById($div_name).innerHTML="<img alt='' src='icons/tick.gif' onmouseover=\"this.src='icons/tick_on_select.gif'; this.style.cursor='hand';\" onmouseout=\"this.src='icons/tick.gif'\" onclick=\"document.forms.forms_manager."+$hidden_name+".value='2'; javascript :change_image('"+$div_name+"', '"+$hidden_name+"');\">";
- }
- else if($check==2)
- {
- document.getElementById($div_name).innerHTML="<img alt='' src='icons/tick_red.gif' onmouseover=\"this.src='icons/tick_red_select.gif'; this.style.cursor='hand';\" onmouseout=\"this.src='icons/tick_red.gif'\" onclick=\"document.forms.forms_manager."+$hidden_name+".value='0'; javascript :change_image('"+$div_name+"', '"+$hidden_name+"');\">";
- }
- }
调用该函数的代码如下:
选择 | 换行 | 行号
- <div id="animal1" style="display: inline;">
- <img alt="" src="icons/no_tick.png" onmouseover="this.src='icons/tick_select.png'; this.style.cursor='hand';" onmouseout="this.src='icons/no_tick.png'" onclick="document.forms.['animal_name']['animal1_key'].value='1'; javascript :change_image('animal1', 'animal1_key');">
- </div>
- <input type="hidden" name="animal1_key" id="animal1_key" value="0"/>