ie8模式下click无反应点击option无反应的解决方法


Posted in Javascript onOctober 11, 2014

想起了小学时候数不尽的一件小事,哎,那夕阳下的奔跑,是我逝去的青春啊。

言归正传,先上图:

<select id="cardNoList" size="4"></select>

实现的效果比较常见的一种,点击select里面的option,将其赋值到上面的input,直接用jQuery写的:

$("#cardNoList option").click(function(){

$("#card").attr("value","").attr("value",this.value); 

})

有个奇怪的事情,

由于面向的用户基本上都是用的360浏览器这类国内双核浏览器,加了

<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"/>

本机Eclipse跑是用的chrome内核进行解析,放到测试环境,就变成ie8标准进行解析了。

现在问题来了,学挖掘……额,不是!

在用IE8打开的时候,点击option没有任何反应。

加alert试了下:

$("#cardNoList option").click(function(){

alert("111");

$("#card").attr("value","").attr("value",this.value);

alert("222"); 

})

click完全没有调用到。

一开始以为是jQuery的click事件在ie8下的兼容问题,但jQuery对兼容都封装解决了,应用如此广,按理不会就我碰到。

后来想到,可能是在ie8下click根本没有加到option上面去,改了改,将click加到select上,成了,ie8、Firefox、chrome都可以顺利赋值到input里。

$("#cardNoList").click(function(){

$("#card").attr("value","").attr("value",this.value);

})

百度了下,貌似“众所周知,在IE里, select的option是不支持onclick事件的” o(?□?)o 

经提醒,改为:

$("#cardNoList").click(function(){

$("#card").val(this.value);

})
Javascript 相关文章推荐
重构Javascript代码示例(重构前后对比)
Jan 23 Javascript
javascript判断chrome浏览器的方法
Mar 26 Javascript
模拟用户点击弹出新页面不会被浏览器拦截
Apr 08 Javascript
使用jQuery异步加载 JavaScript脚本解决方案
Apr 20 Javascript
jQuery+html5实现div弹出层并遮罩背景
Apr 15 Javascript
JavaScript中for循环的使用详解
Jun 03 Javascript
js上下视差滚动简单实现代码
Mar 07 Javascript
详解VueJS应用中管理用户权限
Feb 02 Javascript
vuex直接赋值的三种方法总结
Sep 16 Javascript
详解vue如何使用rules对表单字段进行校验
Oct 17 Javascript
Vue实现简单分页器
Dec 29 Javascript
layui的布局和表格的渲染以及动态生成表格的方法
Sep 18 Javascript
JS 获取鼠标左右键的键值方法
Oct 11 #Javascript
jquery动态加载js/css文件方法(自写小函数)
Oct 11 #Javascript
打造个性化的功能强大的Jquery虚拟键盘(VirtualKeyboard)
Oct 11 #Javascript
JavaScript中实现最高效的数组乱序方法
Oct 11 #Javascript
JavaScript中实现PHP的打乱数组函数shuffle实例
Oct 11 #Javascript
JavaScript定义变量和变量优先级问题探讨
Oct 11 #Javascript
JavaScript中获取鼠标位置相关属性总结
Oct 11 #Javascript
You might like
php 地区分类排序算法
2013/07/01 PHP
Laravel 5.3 学习笔记之 错误&amp;日志
2016/08/28 PHP
PHP使用new StdClass()创建空对象的方法分析
2017/06/06 PHP
php简单读取.vcf格式文件的方法示例
2017/09/02 PHP
php的命名空间与自动加载实现方法
2019/08/25 PHP
jQuery 入门级学习笔记及源码
2010/01/22 Javascript
JS判断数组中是否有重复值得三种实用方法
2013/08/16 Javascript
jQuery 中国省市两级联动选择附图
2014/05/14 Javascript
iScroll中事件点击触发两次解决方案
2015/03/11 Javascript
Easyui form combobox省市区三级联动
2016/01/13 Javascript
概述VUE2.0不可忽视的很多变化
2016/09/25 Javascript
如何制作幻灯片(代码分享)
2017/01/06 Javascript
用file标签实现多图文件上传预览
2017/02/14 Javascript
荐书|您有一份JavaScript书单待签收
2017/07/21 Javascript
BootStrap TreeView使用实例详解
2017/11/01 Javascript
js判断输入框不能为空格或null值的实现方法
2018/03/02 Javascript
5分钟快速掌握JS中var、let和const的异同
2018/09/19 Javascript
JS动画实现回调地狱promise的实例代码详解
2018/11/08 Javascript
微信小程序提交form操作示例
2018/12/30 Javascript
ajaxfileupload.js实现上传文件功能
2019/04/19 Javascript
addEventListener()和removeEventListener()追加事件和删除追加事件
2020/12/04 Javascript
使用Python的判断语句模拟三目运算
2015/04/24 Python
简析Python的闭包和装饰器
2016/02/26 Python
利用Python破解验证码实例详解
2016/12/08 Python
六行python代码的爱心曲线详解
2019/05/17 Python
python匿名函数的使用方法解析
2019/10/10 Python
PythonPC客户端自动化实现原理(pywinauto)
2020/05/28 Python
CSS3实现莲花绽放的动画效果
2020/11/06 HTML / CSS
详解HTML5表单新增属性
2016/12/21 HTML / CSS
html5中为audio标签增加停止按钮动作实现方法
2013/01/04 HTML / CSS
使用phonegap操作数据库的实现方法
2017/03/31 HTML / CSS
ASOS比利时:英国线上零售商及自有品牌
2018/07/29 全球购物
linux面试题参考答案(1)
2016/01/22 面试题
在校生钳工实习自我鉴定
2013/09/19 职场文书
电力安全学习心得体会
2016/01/18 职场文书
使用SQL实现车流量的计算的示例代码
2022/02/28 SQL Server