用jQuery解决IE不支持的option disable属性- Javascript

当前位置: 首页 > 图文教程 > 网络编程 > Javascript > 用jQuery解决IE不支持的option disable属性

Javascript: 实用的JS表单验证提示效果; CSS 直方图布局示例; jquery 动态调整textarea高度; jquery animate 动画效果使用说明; jquery checkbox全选反选效果代码; jquery (show,fadeOut,Animate)简单效果; JavaScript 抽奖效果实现代码数字跳动版; javascript Math.random()随机数函数; jQuery 加上最后自己的验证; JavaScript 自动分号插入（JavaScript synat:auto semicolon insertion）; 兼容多浏览器的iframe自适应高度(ie8 、谷歌浏览器4.0和 firefox3.5.3); javascript 打印内容方法小结; jQuery toggle()设置CSS样式; javaScript parseInt字符转化为数字函数使用小结; 模仿JQuery sortable效果代码有错但值得看看; javascript 常见的闭包问题的解决办法; 在js中单选框和复选框获取值的方式; 按键盘方向键翻页跳转的javascript代码(支持ie,firefox); js 操作table之移动TR位置兼容FF 跟 IE; csdn 论坛技术区平均给分功能

No. « ‹ 271 272 273 274 › »

技术文章搜索

关键字

Javascript 中的用jQuery解决IE不支持的option disable属性

出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2009-10-12 浏览: 507 ::

收藏到网摘: n/a

jquery 圆角遮罩图片实现图片圆角 jQuery 源代码显示控件 (Ajax加载方式).

使用jQuery解决IE不支持的option disable属性

在IE浏览器中，给select的options设置 disable属性是没用的。
必须采用一定手段才可以解决这个问题。当然原理就是记住上次选中的 option。
this.selectedIndex 就派上用场了。
需要刷新下才可以看到效果，因为输出的都是文本，不存在js加载的情况。

点击运行可以看到效果:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> 使用jQuery解决IE不支持的option disable属性 </title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<script src="/upload/tech/20091012/20091012095233_6aca97005c68f1206823815f66102863.js" type="text/javascript"></script>
<script>
$(document).ready(function(){
$(".myselect option:disabled").css('color', '#CCC');
$('.myselect').change(function(){ if(this[this.selectedIndex].disabled){ this.selectedIndex = this.s||0; }else{ this.s = this.selectedIndex||0; }
})
})
</script>
</head>
<body>
<h1>使用jQuery解决IE不支持的option disable属性</h1>
普通：
<select> <option>第1项</option> <option disabled="disabled">第2项</option> <option>第3项</option> <option disabled="disabled">第4项</option> <option >第5项</option> <option >第6项</option>
</select>
对比1：
<select class="myselect"> <option>第1项</option> <option disabled="disabled">第2项</option> <option>第3项</option> <option disabled="disabled">第4项</option> <option >第5项</option> <option >第6项</option>
</select>
对比2：
<select class="myselect"> <option>第1项</option> <option disabled="disabled">第2项</option> <option>第3项</option> <option disabled="disabled">第4项</option> <option >第5项</option> <option >第6项</option>
</select>
<p style="margin-top:200px;font-size:12px;">Dev By CssRain，当然你有兴趣，也可以封装成插件。记得发我一份哦。
</body>
</html>

[Ctrl+A 全选提示:你可先修改部分代码,再按运行]

jquery 圆角遮罩图片实现图片圆角 jQuery 源代码显示控件 (Ajax加载方式).

Javascript 中的 用jQuery解决IE不支持的option disable属性

评论 (0) All

Javascript 中的用jQuery解决IE不支持的option disable属性