让IE的<option>支持click事件http://hi.baidu.com/wymplus/item/0fb481595e22de948d12ed43
来源:互联网 发布:php高并发解决方案视频 编辑:程序博客网 时间:2024/06/05 05:04
使IE中的<option></option>支持click事件
转自:http://hi.baidu.com/wymplus/item/0fb481595e22de948d12ed43
在IE里, select的option是不支持onclick事件的, 而在FF 和 OPERA 里, option 是支持onclick事件的.
(safari似乎也不支持,不过暂时我还不知道如何解决safari的问题.)虽然onchange在某些时刻可以代替 option的click事件, 但是两者并无法做到完全等价.
因为onchange只有在 你点击的option和之前的option不同时才会触发.
当select当前选中的是第一项 而你再次点击第一项时, select是不会被触发的.
下面的代码演示了一种间接实现 option onclick的方法
注意:此方案只适用于 下拉方式的单选select.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>select-option onclick </title>
<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>
</head>
<body>
<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>
</body>
</html>
- 让IE的<option>支持click事件http://hi.baidu.com/wymplus/item/0fb481595e22de948d12ed43
- 让IE的OPTION支持click事件
- http://hi.baidu.com/lhcling/blog/item/0e3e60cfa55aca3ef8dc61c0.html
- http://hi.baidu.com/yingshuishui1/item/c6a1610ad1b4851bebfe3870
- http://hi.baidu.com/luckystreet/item/c4a6f10c417db2f1a11034ec
- http://hi.baidu.com/3582077/item/e1ae928ba93b8c55e63d190a
- cygwin 支持IPC http://hi.baidu.com/wangzhiqing999/blog/item/3cfe34c6587abe060ef47794.html
- asp.net javascript回车键事件http://hi.baidu.com/xuexiang516168/blog/item/90f2bc4bc316372908f7eff4.html
- HTTPS和HTTP的区别(http://hi.baidu.com/kannan/blog/item/27ab730efbe744cb7bcbe1c4.html)
- http://hi.baidu.com/heyg/blog/item/9ca8dcc4785706cb38db4937.html
- http://hi.baidu.com/suwey/blog/item/9b4d72c238e7e334e5dd3bc0.html
- http://hi.baidu.com/jmugis/blog/item/ad03b11f89a25ef6e1fe0b18.html
- http://hi.baidu.com/nnffnn/blog/item/e84cd15c1d893943faf2c07c.html
- http://hi.baidu.com/herowzz/blog/item/286e3c546eb23157574e0077.html
- http://hi.baidu.com/kacaca/blog/item/1fd412d644f9f42907088b89.html
- http://hi.baidu.com/sophie198384/blog/item/26960501e9a757021d9583a0.html
- http://hi.baidu.com/123az/blog/item/f482f51980e8e04642a9ad6c.html
- http://hi.baidu.com/zonesky/blog/item/328d9807043c2ccb7a894717.html
- PHP简单工厂模式
- double类型精度问题格式设置
- XCode 快捷键一栏
- Sequence NOIp2013-Training Series #4
- man ipcs ipcrm
- 让IE的<option>支持click事件http://hi.baidu.com/wymplus/item/0fb481595e22de948d12ed43
- Ubuntu 10.04搭建Scratchbox交叉编译环境
- C++多线程实例(_beginThreadex创建多线程)
- linux下普通用户没有crontab权限问题解决
- 12、Hibernate内存查询与数据库查询
- __Praesidio_
- mysql变量使用总结
- 不只是技术!成为IT经理必备的十大软技能
- 赋值到excel表,从excel表取值