select选择已选中的option不触发onchange事件的解决办法
前端笔记 2021-05-13 13:55:17

 

XML/HTML Code复制内容到剪贴板
  1. <!DOCTYPE html>  
  2. <html>  
  3. <head>  
  4.     <title></title>  
  5. </head>  
  6. <body>  
  7.     <select id="u18">  
  8.         <option value="1">xxxxxxxx1</option>  
  9.         <option value="2">xxxxxxxx2</option>  
  10.         <option value="3">xxxxxxxx3</option>  
  11.     </select>  
  12. </body>  
  13. <script type="text/javascript">  
  14.       
  15. var id = document.getElementById("u18");  
  16.   
  17. id.addEventListener('change',function(){  
  18.     alert(this.value);  
  19. });//单一添加下拉改变事件  
  20.   
  21. id.onmousedown = function(){//当按下鼠标按钮的时候  
  22.     thisthis.sindex = this.selectedIndex;//把当前选中的值得索引赋给下拉选中的索引  
  23.     this.selectedIndex = -1;//把下拉选中的索引改变为-1,也就是没有!  
  24. }  
  25.   
  26. id.onmouseout = function(){//当鼠标移开的时候  
  27.     var index = id.selectedIndex;//获取下拉选中的索引  
  28.     if(index == -1){//如果为-1,就是根本没有选  
  29.     thisthis.selectedIndex = this.sindex;//就把下拉选中的索引改变成之前选中的值得索引,就默认选择的是之前选中的值  
  30.     }  
  31. }  
  32.   
  33. </script>  
  34. </html>  

 

 

 

本文来自于:http://www.yoyo88.cn/note/frontend/569.html

Powered by yoyo苏ICP备15045725号