select onclick

最新推荐文章于 2019-05-16 16:01:39 发布

wfdoublext

最新推荐文章于 2019-05-16 16:01:39 发布

阅读量152

点赞数

CC 4.0 BY-SA版权

分类专栏： javascript 文章标签： IE Opera JavaScript ViewUI

本文链接：https://blog.youkuaiyun.com/wfdoublext/article/details/83258494

javascript 专栏收录该内容

40 篇文章

订阅专栏

本文介绍了一种在Internet Explorer浏览器环境下对HTML Select元素进行特殊处理的方法，通过JavaScript实现对Select下拉框的选择行为监测，并记录用户的选项选择过程。

<script type="text/javascript" >  
  
function simOptionClick4IE(){   
    var evt=window.event  ;   
    var selectObj=evt?evt.srcElement:null;   
    // IE Only   
    if (evt && selectObj &&  evt.offsetY && evt.button!=2   
        && (evt.offsetY > selectObj.offsetHeight || evt.offsetY<0 ) ) {   
               
            // 记录原先的选中项   
            var oldIdx = selectObj.selectedIndex;   
  
            setTimeout(function(){   
                var option=selectObj.options[selectObj.selectedIndex];   
                // 此时可以通过判断 oldIdx 是否等于 selectObj.selectedIndex   
                // 来判断用户是不是点击了同一个选项,进而做不同的处理.   
                showOptionValue(option)   
  
            }, 60);   
    }   
}   
function showOptionValue(opt,msg){   
    var now=new Date();   
    var dt= (1900+now.getYear())+'-'+(now.getMonth()+1)+'-'+now.getDate()+   
            ' '+now.getHours()+':'+now.getHours()+':'+now.getSeconds()+'.'+now.getMilliseconds();   
    var resultZone=document.getElementById('reslut');   
    resultZone.style.margin="10px";   
    resultZone.innerHTML=dt +" 时,点击了: " + (opt.text + ' = '+opt.value);   
}   
  

  
</script>

<select  onclick="simOptionClick4IE()" >    
    <!-- 下面的 onclick="showOptionValue( this )" 是为 ff 和 opera而准备 -->  
    <option value="1" onclick="showOptionValue( this )" >aaaaa</option>  
    <option value="2" onclick="showOptionValue( this )" >bbbbb</option>  
    <option value="3" onclick="showOptionValue( this )" >ccccc</option>  
  </select>  
  
<div id="reslut" ></div>