Rumah > hujung hadapan web > html tutorial > select中无法使用click的处理 - 嗑瓜子儿gf

select中无法使用click的处理 - 嗑瓜子儿gf

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
Lepaskan: 2016-05-20 13:46:37
asal
1488 orang telah melayarinya

今天工作用到了select,想要给option添加click点击事件,可是却没有任何效果,百度了才发现,原来竟然是不支持呀!

众所周知(其实我才知道哎),在IE里, select的option是不支持onclick事件的, 而在FF 和 OPERA 里, option 是支持onclick事件的.
(safari似乎也不支持,不过暂时我还不知道如何解决safari的问题.)

我今天是用onchange来解决的,原谅也是才知道它可以用这个。select状态改变来调用函数。

<span style="color: #008080;"> 1</span> <span style="color: #0000ff;"><span style="color: #ff00ff;">DOCTYPE html</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 2</span> <span style="color: #0000ff;"><span style="color: #800000;">html</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 3</span> <span style="color: #0000ff;"><span style="color: #800000;">head </span><span style="color: #ff0000;">lang</span><span style="color: #0000ff;">="en"</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 4</span>     <span style="color: #0000ff;"><span style="color: #800000;">meta </span><span style="color: #ff0000;">charset</span><span style="color: #0000ff;">="UTF-8"</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 5</span>     <span style="color: #0000ff;"><span style="color: #800000;">script </span><span style="color: #ff0000;">src</span><span style="color: #0000ff;">="js/jquery-1.11.3.js"</span><span style="color: #0000ff;">></span><span style="color: #800000;">script</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 6</span>     <span style="color: #0000ff;"><span style="color: #800000;">title</span><span style="color: #0000ff;">></span><span style="color: #800000;">title</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 7</span> <span style="color: #0000ff;"></span><span style="color: #800000;">head</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 8</span> <span style="color: #0000ff;"><span style="color: #800000;">body</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 9</span> 
<span style="color: #008080;">10</span> <span style="color: #0000ff;"><span style="color: #800000;">select </span><span style="color: #ff0000;">name</span><span style="color: #0000ff;">=""</span><span style="color: #ff0000;"> id</span><span style="color: #0000ff;">="qq"</span><span style="color: #ff0000;"> onchange</span><span style="color: #0000ff;">="outputSelect()"</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">11</span>     <span style="color: #0000ff;"><span style="color: #800000;">option </span><span style="color: #ff0000;">value</span><span style="color: #0000ff;">="1"</span><span style="color: #0000ff;">></span>qq<span style="color: #0000ff;"></span><span style="color: #800000;">option</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">12</span>     <span style="color: #0000ff;"><span style="color: #800000;">option </span><span style="color: #ff0000;">value</span><span style="color: #0000ff;">="2"</span><span style="color: #0000ff;">></span>bbb<span style="color: #0000ff;"></span><span style="color: #800000;">option</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">13</span>     <span style="color: #0000ff;"><span style="color: #800000;">option </span><span style="color: #ff0000;">value</span><span style="color: #0000ff;">="3"</span><span style="color: #0000ff;">></span>ccc<span style="color: #0000ff;"></span><span style="color: #800000;">option</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">14</span> <span style="color: #0000ff;"></span><span style="color: #800000;">select</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">15</span> <span style="color: #0000ff;"><span style="color: #800000;">div</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">16</span> <span style="color: #0000ff;"><span style="color: #800000;">div </span><span style="color: #ff0000;">class</span><span style="color: #0000ff;">="con"</span><span style="color: #ff0000;"> style</span><span style="color: #0000ff;">="display:none"</span><span style="color: #0000ff;">></span>111<span style="color: #0000ff;"></span><span style="color: #800000;">div</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">17</span> <span style="color: #0000ff;"><span style="color: #800000;">div </span><span style="color: #ff0000;">class</span><span style="color: #0000ff;">="con"</span><span style="color: #ff0000;"> style</span><span style="color: #0000ff;">="display:none"</span><span style="color: #0000ff;">></span>222<span style="color: #0000ff;"></span><span style="color: #800000;">div</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">18</span> <span style="color: #0000ff;"><span style="color: #800000;">div </span><span style="color: #ff0000;">class</span><span style="color: #0000ff;">="con"</span><span style="color: #ff0000;"> style</span><span style="color: #0000ff;">="display:none"</span><span style="color: #0000ff;">></span>333<span style="color: #0000ff;"></span><span style="color: #800000;">div</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">19</span> <span style="color: #0000ff;"></span><span style="color: #800000;">div</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">20</span> <span style="color: #0000ff;"><span style="color: #800000;">script</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">21</span> <span style="background-color: #f5f5f5; color: #000000;">    $(</span><span style="background-color: #f5f5f5; color: #000000;">"</span><span style="background-color: #f5f5f5; color: #000000;">.con</span><span style="background-color: #f5f5f5; color: #000000;">"</span><span style="background-color: #f5f5f5; color: #000000;">).eq(</span><span style="background-color: #f5f5f5; color: #000000;">0</span><span style="background-color: #f5f5f5; color: #000000;">).show();
</span><span style="color: #008080;">22</span>     <span style="background-color: #f5f5f5; color: #0000ff;">function</span><span style="background-color: #f5f5f5; color: #000000;"> outputSelect(){
</span><span style="color: #008080;">23</span> <span style="background-color: #f5f5f5; color: #000000;">        console.log(</span><span style="background-color: #f5f5f5; color: #000000;">"</span><span style="background-color: #f5f5f5; color: #000000;">aa</span><span style="background-color: #f5f5f5; color: #000000;">"</span><span style="background-color: #f5f5f5; color: #000000;">);
</span><span style="color: #008080;">24</span>         <span style="background-color: #f5f5f5; color: #0000ff;">var</span><span style="background-color: #f5f5f5; color: #000000;"> num </span><span style="background-color: #f5f5f5; color: #000000;">=</span><span style="background-color: #f5f5f5; color: #000000;">$(</span><span style="background-color: #f5f5f5; color: #000000;">"</span><span style="background-color: #f5f5f5; color: #000000;">#qq</span><span style="background-color: #f5f5f5; color: #000000;">"</span><span style="background-color: #f5f5f5; color: #000000;">).find(</span><span style="background-color: #f5f5f5; color: #000000;">"</span><span style="background-color: #f5f5f5; color: #000000;">option:selected</span><span style="background-color: #f5f5f5; color: #000000;">"</span><span style="background-color: #f5f5f5; color: #000000;">).index();
</span><span style="color: #008080;">25</span> <span style="background-color: #f5f5f5; color: #000000;">        console.log(num);
</span><span style="color: #008080;">26</span> <span style="background-color: #f5f5f5; color: #000000;">        $(</span><span style="background-color: #f5f5f5; color: #000000;">"</span><span style="background-color: #f5f5f5; color: #000000;">.con</span><span style="background-color: #f5f5f5; color: #000000;">"</span><span style="background-color: #f5f5f5; color: #000000;">).hide();
</span><span style="color: #008080;">27</span> <span style="background-color: #f5f5f5; color: #000000;">        $(</span><span style="background-color: #f5f5f5; color: #000000;">"</span><span style="background-color: #f5f5f5; color: #000000;">.con</span><span style="background-color: #f5f5f5; color: #000000;">"</span><span style="background-color: #f5f5f5; color: #000000;">).eq(num).show().siblings().hide();
</span><span style="color: #008080;">28</span> <span style="background-color: #f5f5f5; color: #000000;">    }
</span><span style="color: #008080;">29</span> 
<span style="color: #008080;">30</span> <span style="background-color: #f5f5f5; color: #000000;">    console.log($(</span><span style="background-color: #f5f5f5; color: #000000;">"</span><span style="background-color: #f5f5f5; color: #000000;">#qq</span><span style="background-color: #f5f5f5; color: #000000;">"</span><span style="background-color: #f5f5f5; color: #000000;">).find(</span><span style="background-color: #f5f5f5; color: #000000;">"</span><span style="background-color: #f5f5f5; color: #000000;">option:selected</span><span style="background-color: #f5f5f5; color: #000000;">"</span><span style="background-color: #f5f5f5; color: #000000;">).val());
</span><span style="color: #008080;">31</span>     <span style="background-color: #f5f5f5; color: #0000ff;">var</span><span style="background-color: #f5f5f5; color: #000000;"> aa</span><span style="background-color: #f5f5f5; color: #000000;">=</span><span style="background-color: #f5f5f5; color: #000000;">$(</span><span style="background-color: #f5f5f5; color: #000000;">"</span><span style="background-color: #f5f5f5; color: #000000;">#qq option:selected</span><span style="background-color: #f5f5f5; color: #000000;">"</span><span style="background-color: #f5f5f5; color: #000000;">).val();
</span><span style="color: #008080;">32</span> <span style="background-color: #f5f5f5; color: #000000;">    console.log(aa);
</span><span style="color: #008080;">33</span> <span style="color: #0000ff;"></span><span style="color: #800000;">script</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">34</span> <span style="color: #0000ff;"></span><span style="color: #800000;">body</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">35</span> <span style="color: #0000ff;"></span><span style="color: #800000;">html</span><span style="color: #0000ff;">></span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></span>
Salin selepas log masuk

虽然onchange在某些时刻可以代替 option的click事件, 但是两者并无法做到完全等价. 因为onchange只有在 你点击的option和之前的option不同时才会触发. 当select当前选中的是第一项  而你再次点击第一项时, select是不会被触发的.

下面的代码演示了一种间接实现 option onclick的方法 
Salin selepas log masuk
注意:此方案只适用于 下拉方式的单选select.
Salin selepas log masuk
<span style="color: #008080;"> 1</span>     <span style="color: #0000ff;"><span style="color: #ff00ff;">DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"</span><span style="color: #0000ff;">></span>  
<span style="color: #008080;"> 2</span>     <span style="color: #0000ff;"><span style="color: #800000;">html</span><span style="color: #0000ff;">></span>  
<span style="color: #008080;"> 3</span>      <span style="color: #0000ff;"><span style="color: #800000;">head</span><span style="color: #0000ff;">></span>  
<span style="color: #008080;"> 4</span>       <span style="color: #0000ff;"><span style="color: #800000;">title</span><span style="color: #0000ff;">></span>select-option onclick <span style="color: #0000ff;"></span><span style="color: #800000;">title</span><span style="color: #0000ff;">></span>  
<span style="color: #008080;"> 5</span>     <span style="color: #0000ff;"><span style="color: #800000;">script </span><span style="color: #ff0000;">type</span><span style="color: #0000ff;">="text/javascript"</span> <span style="color: #0000ff;">></span>  
<span style="color: #008080;"> 6</span>       
<span style="color: #008080;"> 7</span>     <span style="background-color: #f5f5f5; color: #0000ff;">function</span><span style="background-color: #f5f5f5; color: #000000;"> simOptionClick4IE(){  
</span><span style="color: #008080;"> 8</span>         <span style="background-color: #f5f5f5; color: #0000ff;">var</span><span style="background-color: #f5f5f5; color: #000000;"> evt</span><span style="background-color: #f5f5f5; color: #000000;">=</span><span style="background-color: #f5f5f5; color: #000000;">window.event  ;  
</span><span style="color: #008080;"> 9</span>         <span style="background-color: #f5f5f5; color: #0000ff;">var</span><span style="background-color: #f5f5f5; color: #000000;"> selectObj</span><span style="background-color: #f5f5f5; color: #000000;">=</span><span style="background-color: #f5f5f5; color: #000000;">evt</span><span style="background-color: #f5f5f5; color: #000000;">?</span><span style="background-color: #f5f5f5; color: #000000;">evt.srcElement:</span><span style="background-color: #f5f5f5; color: #0000ff;">null</span><span style="background-color: #f5f5f5; color: #000000;">;  
</span><span style="color: #008080;">10</span>         <span style="background-color: #f5f5f5; color: #008000;">//</span><span style="background-color: #f5f5f5; color: #008000;"> IE Only  </span>
<span style="color: #008080;">11</span>         <span style="background-color: #f5f5f5; color: #0000ff;">if</span><span style="background-color: #f5f5f5; color: #000000;"> (evt </span><span style="background-color: #f5f5f5; color: #000000;">&&</span><span style="background-color: #f5f5f5; color: #000000;"> selectObj </span><span style="background-color: #f5f5f5; color: #000000;">&&</span><span style="background-color: #f5f5f5; color: #000000;">  evt.offsetY </span><span style="background-color: #f5f5f5; color: #000000;">&&</span><span style="background-color: #f5f5f5; color: #000000;"> evt.button</span><span style="background-color: #f5f5f5; color: #000000;">!=</span><span style="background-color: #f5f5f5; color: #000000;">2</span>  
<span style="color: #008080;">12</span>             <span style="background-color: #f5f5f5; color: #000000;">&&</span><span style="background-color: #f5f5f5; color: #000000;"> (evt.offsetY </span><span style="background-color: #f5f5f5; color: #000000;">></span><span style="background-color: #f5f5f5; color: #000000;"> selectObj.offsetHeight </span><span style="background-color: #f5f5f5; color: #000000;">||</span><span style="background-color: #f5f5f5; color: #000000;"> evt.offsetY</span><span style="background-color: #f5f5f5; color: #000000;"><span style="background-color: #f5f5f5; color: #000000;">0</span><span style="background-color: #f5f5f5; color: #000000;"> ) ) {  
</span><span style="color: #008080;">13</span>                   
<span style="color: #008080;">14</span>                 <span style="background-color: #f5f5f5; color: #008000;">//</span><span style="background-color: #f5f5f5; color: #008000;"> 记录原先的选中项  </span>
<span style="color: #008080;">15</span>                 <span style="background-color: #f5f5f5; color: #0000ff;">var</span><span style="background-color: #f5f5f5; color: #000000;"> oldIdx </span><span style="background-color: #f5f5f5; color: #000000;">=</span><span style="background-color: #f5f5f5; color: #000000;"> selectObj.selectedIndex;  
</span><span style="color: #008080;">16</span>       
<span style="color: #008080;">17</span> <span style="background-color: #f5f5f5; color: #000000;">                setTimeout(</span><span style="background-color: #f5f5f5; color: #0000ff;">function</span><span style="background-color: #f5f5f5; color: #000000;">(){  
</span><span style="color: #008080;">18</span>                     <span style="background-color: #f5f5f5; color: #0000ff;">var</span><span style="background-color: #f5f5f5; color: #000000;"> option</span><span style="background-color: #f5f5f5; color: #000000;">=</span><span style="background-color: #f5f5f5; color: #000000;">selectObj.options[selectObj.selectedIndex];  
</span><span style="color: #008080;">19</span>                     <span style="background-color: #f5f5f5; color: #008000;">//</span><span style="background-color: #f5f5f5; color: #008000;"> 此时可以通过判断 oldIdx 是否等于 selectObj.selectedIndex  </span>
<span style="color: #008080;">20</span>                     <span style="background-color: #f5f5f5; color: #008000;">//</span><span style="background-color: #f5f5f5; color: #008000;"> 来判断用户是不是点击了同一个选项,进而做不同的处理.  </span>
<span style="color: #008080;">21</span> <span style="background-color: #f5f5f5; color: #000000;">                    showOptionValue(option)  
</span><span style="color: #008080;">22</span>       
<span style="color: #008080;">23</span> <span style="background-color: #f5f5f5; color: #000000;">                }, </span><span style="background-color: #f5f5f5; color: #000000;">60</span><span style="background-color: #f5f5f5; color: #000000;">);  
</span><span style="color: #008080;">24</span> <span style="background-color: #f5f5f5; color: #000000;">        }  
</span><span style="color: #008080;">25</span> <span style="background-color: #f5f5f5; color: #000000;">    }  
</span><span style="color: #008080;">26</span>       
<span style="color: #008080;">27</span>     <span style="background-color: #f5f5f5; color: #0000ff;">function</span><span style="background-color: #f5f5f5; color: #000000;"> showOptionValue(opt,msg){  
</span><span style="color: #008080;">28</span>         <span style="background-color: #f5f5f5; color: #0000ff;">var</span><span style="background-color: #f5f5f5; color: #000000;"> now</span><span style="background-color: #f5f5f5; color: #000000;">=</span><span style="background-color: #f5f5f5; color: #0000ff;">new</span><span style="background-color: #f5f5f5; color: #000000;"> Date();  
</span><span style="color: #008080;">29</span>         <span style="background-color: #f5f5f5; color: #0000ff;">var</span><span style="background-color: #f5f5f5; color: #000000;"> dt</span><span style="background-color: #f5f5f5; color: #000000;">=</span><span style="background-color: #f5f5f5; color: #000000;"> (</span><span style="background-color: #f5f5f5; color: #000000;">1900</span><span style="background-color: #f5f5f5; color: #000000;">+</span><span style="background-color: #f5f5f5; color: #000000;">now.getYear())</span><span style="background-color: #f5f5f5; color: #000000;">+</span><span style="background-color: #f5f5f5; color: #000000;">'</span><span style="background-color: #f5f5f5; color: #000000;">-</span><span style="background-color: #f5f5f5; color: #000000;">'</span><span style="background-color: #f5f5f5; color: #000000;">+</span><span style="background-color: #f5f5f5; color: #000000;">(now.getMonth()</span><span style="background-color: #f5f5f5; color: #000000;">+</span><span style="background-color: #f5f5f5; color: #000000;">1</span><span style="background-color: #f5f5f5; color: #000000;">)</span><span style="background-color: #f5f5f5; color: #000000;">+</span><span style="background-color: #f5f5f5; color: #000000;">'</span><span style="background-color: #f5f5f5; color: #000000;">-</span><span style="background-color: #f5f5f5; color: #000000;">'</span><span style="background-color: #f5f5f5; color: #000000;">+</span><span style="background-color: #f5f5f5; color: #000000;">now.getDate()</span><span style="background-color: #f5f5f5; color: #000000;">+</span>  
<span style="color: #008080;">30</span>                 <span style="background-color: #f5f5f5; color: #000000;">'</span> <span style="background-color: #f5f5f5; color: #000000;">'</span><span style="background-color: #f5f5f5; color: #000000;">+</span><span style="background-color: #f5f5f5; color: #000000;">now.getHours()</span><span style="background-color: #f5f5f5; color: #000000;">+</span><span style="background-color: #f5f5f5; color: #000000;">'</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #000000;">'</span><span style="background-color: #f5f5f5; color: #000000;">+</span><span style="background-color: #f5f5f5; color: #000000;">now.getHours()</span><span style="background-color: #f5f5f5; color: #000000;">+</span><span style="background-color: #f5f5f5; color: #000000;">'</span><span style="background-color: #f5f5f5; color: #000000;">:</span><span style="background-color: #f5f5f5; color: #000000;">'</span><span style="background-color: #f5f5f5; color: #000000;">+</span><span style="background-color: #f5f5f5; color: #000000;">now.getSeconds()</span><span style="background-color: #f5f5f5; color: #000000;">+</span><span style="background-color: #f5f5f5; color: #000000;">'</span><span style="background-color: #f5f5f5; color: #000000;">.</span><span style="background-color: #f5f5f5; color: #000000;">'</span><span style="background-color: #f5f5f5; color: #000000;">+</span><span style="background-color: #f5f5f5; color: #000000;">now.getMilliseconds();  
</span><span style="color: #008080;">31</span>         <span style="background-color: #f5f5f5; color: #0000ff;">var</span><span style="background-color: #f5f5f5; color: #000000;"> resultZone</span><span style="background-color: #f5f5f5; color: #000000;">=</span><span style="background-color: #f5f5f5; color: #000000;">document.getElementById(</span><span style="background-color: #f5f5f5; color: #000000;">'</span><span style="background-color: #f5f5f5; color: #000000;">reslut</span><span style="background-color: #f5f5f5; color: #000000;">'</span><span style="background-color: #f5f5f5; color: #000000;">);  
</span><span style="color: #008080;">32</span> <span style="background-color: #f5f5f5; color: #000000;">        resultZone.style.margin</span><span style="background-color: #f5f5f5; color: #000000;">=</span><span style="background-color: #f5f5f5; color: #000000;">"</span><span style="background-color: #f5f5f5; color: #000000;">10px</span><span style="background-color: #f5f5f5; color: #000000;">"</span><span style="background-color: #f5f5f5; color: #000000;">;  
</span><span style="color: #008080;">33</span> <span style="background-color: #f5f5f5; color: #000000;">        resultZone.innerHTML</span><span style="background-color: #f5f5f5; color: #000000;">=</span><span style="background-color: #f5f5f5; color: #000000;">dt </span><span style="background-color: #f5f5f5; color: #000000;">+</span><span style="background-color: #f5f5f5; color: #000000;">"</span><span style="background-color: #f5f5f5; color: #000000;"> 时,点击了: </span><span style="background-color: #f5f5f5; color: #000000;">"</span> <span style="background-color: #f5f5f5; color: #000000;">+</span><span style="background-color: #f5f5f5; color: #000000;"> (opt.text </span><span style="background-color: #f5f5f5; color: #000000;">+</span> <span style="background-color: #f5f5f5; color: #000000;">'</span><span style="background-color: #f5f5f5; color: #000000;"> = </span><span style="background-color: #f5f5f5; color: #000000;">'</span><span style="background-color: #f5f5f5; color: #000000;">+</span><span style="background-color: #f5f5f5; color: #000000;">opt.value);  
</span><span style="color: #008080;">34</span> <span style="background-color: #f5f5f5; color: #000000;">    }  
</span><span style="color: #008080;">35</span>       
<span style="color: #008080;">36</span>     <span style="color: #0000ff;"></span><span style="color: #800000;">script</span><span style="color: #0000ff;">></span>  
<span style="color: #008080;">37</span>      <span style="color: #0000ff;"></span><span style="color: #800000;">head</span><span style="color: #0000ff;">></span>  
<span style="color: #008080;">38</span>       
<span style="color: #008080;">39</span>      <span style="color: #0000ff;"><span style="color: #800000;">body</span><span style="color: #0000ff;">></span>  
<span style="color: #008080;">40</span>       
<span style="color: #008080;">41</span>       <span style="color: #0000ff;"><span style="color: #800000;">select  </span><span style="color: #ff0000;">onclick</span><span style="color: #0000ff;">="simOptionClick4IE()"</span> <span style="color: #0000ff;">></span>   
<span style="color: #008080;">42</span>         <span style="color: #008000;"><!--</span><span style="color: #008000;"> 下面的 onclick="showOptionValue( this )" 是为 ff 和 opera而准备 </span><span style="color: #008000;">--></span>  
<span style="color: #008080;">43</span>         <span style="color: #0000ff;"><span style="color: #800000;">option </span><span style="color: #ff0000;">value</span><span style="color: #0000ff;">="1"</span><span style="color: #ff0000;"> onclick</span><span style="color: #0000ff;">="showOptionValue( this )"</span> <span style="color: #0000ff;">></span>aaaaa<span style="color: #0000ff;"></span><span style="color: #800000;">option</span><span style="color: #0000ff;">></span>  
<span style="color: #008080;">44</span>         <span style="color: #0000ff;"><span style="color: #800000;">option </span><span style="color: #ff0000;">value</span><span style="color: #0000ff;">="2"</span><span style="color: #ff0000;"> onclick</span><span style="color: #0000ff;">="showOptionValue( this )"</span> <span style="color: #0000ff;">></span>bbbbb<span style="color: #0000ff;"></span><span style="color: #800000;">option</span><span style="color: #0000ff;">></span>  
<span style="color: #008080;">45</span>         <span style="color: #0000ff;"><span style="color: #800000;">option </span><span style="color: #ff0000;">value</span><span style="color: #0000ff;">="3"</span><span style="color: #ff0000;"> onclick</span><span style="color: #0000ff;">="showOptionValue( this )"</span> <span style="color: #0000ff;">></span>ccccc<span style="color: #0000ff;"></span><span style="color: #800000;">option</span><span style="color: #0000ff;">></span>  
<span style="color: #008080;">46</span>       <span style="color: #0000ff;"></span><span style="color: #800000;">select</span><span style="color: #0000ff;">></span>  
<span style="color: #008080;">47</span>       
<span style="color: #008080;">48</span>     <span style="color: #0000ff;"><span style="color: #800000;">div </span><span style="color: #ff0000;">id</span><span style="color: #0000ff;">="reslut"</span> <span style="color: #0000ff;">></span><span style="color: #800000;">div</span><span style="color: #0000ff;">></span>  
<span style="color: #008080;">49</span>     <span style="color: #0000ff;"></span><span style="color: #800000;">body</span><span style="color: #0000ff;">></span>  
<span style="color: #008080;">50</span>     <span style="color: #0000ff;"></span><span style="color: #800000;">html</span><span style="color: #0000ff;">></span>  </span></span></span></span></span></span></span></span></span></span></span></span>
Salin selepas log masuk

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

才知道),在IE里,select的option是不支持onclick事件的, 而在 FF 和 OPERA 里, option 是支持onclick事件的. (似乎也不支持,不过暂时我还不知道如何解决safari的问题.)

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan