js获取select默认选中的Option并不是当前选中值


Posted in Javascript onMay 07, 2014

js函数方法:

<script> 
function getDefaultSelectedOption(selectId, valIfNull) { 
var dom, selectId = selectId.replace(/^#/, ''), opts; 
try { 
opts = document.getElementById(selectId).getElementsByTagName('option'); 
for (var i in opts) { 
if (opts[i].defaultSelected) { 
dom = opts[i]; 
break; 
} 
} 
} catch (e) { 
} 
return dom||valIfNull; 
} 
</script>

Demo:
<body> 
<select id="sel"> 
<option value="1">1</option> 
<option value="2" selected="">2</option> 
<option value="3">3</option> 
</select> 
<button id="btn">test</button> 
<script> 
function getDefaultSelectedOption(selectId, valIfNull) { 
var dom, selectId = selectId.replace(/^#/, ''), opts; 
try { 
opts = document.getElementById(selectId).getElementsByTagName('option'); 
for (var i in opts) { 
if (opts[i].defaultSelected) { 
dom = opts[i]; 
break; 
} 
} 
} catch (e) { 
} 
return dom||valIfNull; 
} 
</script> 
<script> 
document.getElementById('btn').onclick = function () { 
alert((getDefaultSelectedOption('sel1', {})).value); 
}; 
</script> 
</body>

不知道还有没有更方便快捷的方法,曾尝试通过jQuery获取$('#sel option[defaultSelected]'),可一直返回空。

各位园友,我要的是select控件初始化的值,非select当前选中的值,初始化的值不随select值改变,大家可以做一下Demo,当select值改变后,初始化的值是不会变的。

Javascript 相关文章推荐
模拟select的代码
Oct 19 Javascript
谈谈JavaScript中的函数与闭包
Apr 14 Javascript
Bootstrap页面缩小变形的快速解决办法
Feb 03 Javascript
详解vue父子模版嵌套案例
Mar 04 Javascript
JS使用cookie实现只出现一次的广告代码效果
Apr 22 Javascript
node+koa实现数据mock接口的方法
Sep 20 Javascript
jQuery实现的模仿雨滴下落动画效果
Dec 11 jQuery
JS使用数组实现的队列功能示例
Mar 04 Javascript
详解一个小实例理解js原型和继承
Apr 24 Javascript
vue组件的路由高亮问题解决方法
May 11 Vue.js
React Native项目框架搭建的一些心得体会
May 28 Javascript
React 并发功能体验(前端的并发模式)
Jul 01 Javascript
iframe子页面与父页面在同域或不同域下的js通信
May 07 #Javascript
jquery文本框中的事件应用以输入邮箱为例
May 06 #Javascript
jquery删除数据记录时的弹出提示效果
May 06 #Javascript
js单词形式的运算符
May 06 #Javascript
js函数调用的方式
May 06 #Javascript
js使用ajax读博客rss示例
May 06 #Javascript
Android中的jQuery:AQuery简介
May 06 #Javascript
You might like
星际初学者游戏中永远要做的事
2020/03/04 星际争霸
php生成EXCEL的东东
2006/10/09 PHP
php中比较简单的导入phpmyadmin生成的sql文件的方法
2011/06/28 PHP
二进制交叉权限微型php类分享
2014/02/07 PHP
thinkphp中空模板与空模块的用法实例
2014/11/26 PHP
PHP实现自动识别Restful API的返回内容类型
2015/02/07 PHP
基于ThinkPHP实现的日历功能实例详解
2017/04/15 PHP
Laravel框架基于中间件实现禁止未登录用户访问页面功能示例
2019/01/17 PHP
防止动态加载JavaScript引起的内存泄漏问题
2009/10/08 Javascript
JQuery文本框高亮显示插件代码
2011/04/02 Javascript
由Javascript实现的页面日历
2011/11/04 Javascript
javascript使用定时函数实现跳转到某个页面
2013/12/25 Javascript
jquery 鼠标滑动显示详情应用示例
2014/01/24 Javascript
深入理解JavaScript系列(38):设计模式之职责链模式详解
2015/03/04 Javascript
介绍一个简单的JavaScript类框架
2015/06/24 Javascript
JS实现网页上随机产生超链接地址的方法
2015/11/09 Javascript
JS中append字符串包含onclick无效传递参数失败的解决方案
2016/12/26 Javascript
vue省市区三联动下拉选择组件的实现
2017/04/28 Javascript
浅谈node中的exports与module.exports的关系
2017/08/01 Javascript
vue组件挂载到全局方法的示例代码
2018/08/02 Javascript
vue项目中使用Hbuilder打包app 设置沉浸式状态栏的方法
2018/10/22 Javascript
基于JS判断对象是否是数组
2020/01/10 Javascript
vue $router和$route的区别详解
2020/12/02 Vue.js
使用Python发送邮件附件以定时备份MySQL的教程
2015/04/25 Python
详解python之多进程和进程池(Processing库)
2017/06/09 Python
python实现协同过滤推荐算法完整代码示例
2017/12/15 Python
django+echart绘制曲线图的方法示例
2018/11/26 Python
浅谈python脚本设置运行参数的方法
2018/12/03 Python
Django使用中间键实现csrf认证详解
2019/07/22 Python
基于jupyter代码无法在pycharm中运行的解决方法
2020/04/21 Python
python 解决函数返回return的问题
2020/12/05 Python
意大利在线大学图书馆:Libreria universitaria
2019/07/16 全球购物
骨干教师培训方案
2014/05/06 职场文书
安全生产月宣传标语
2014/10/06 职场文书
2015国际残疾人日活动总结
2015/03/24 职场文书
植树节新闻稿
2015/07/17 职场文书