用js设置下拉框为只读的小技巧


Posted in Javascript onApril 10, 2014

在项目开发过程中我们时常会碰到要设置下拉框为只读(readonly),但是可惜的是select没有只读属性,所以需要在select外面包含一个span,通过js来改变。

下面这段html代码是在struts2的下拉标签中加入了span标签,在页面装载的时候就让下拉框变成不可读。

<body onload="init()"> 
<span id="id_select"> 
<s:select name="sjdwmc" list="sjdxdwList" listKey="dxbh" listValue="dwmc" headerKey="" headerValue=""></s:select> 
</span> 
</body>

如下是js代码,在init方法中调用selectReadOnly让下拉框变成只读。
/*根据页面上span的id设置select为只读/ function selectReadOnly(selectedId){ 
var obj = document.getElementById(selectedId); 
obj.onmouseover = function(){ 
obj.setCapture(); 
} 
obj.onmouseout = function(){ 
obj.releaseCapture(); 
} 
obj.onfocus = function(){ 
obj.blur(); 
} 
obj.onbeforeactivate = function(){ 
return false; 
} 
} 
function init(){ 
selectReadOnly("id_select"); 
}

做到这里大功告成,试试效果吧!!!
Javascript 相关文章推荐
js相册效果代码(点击创建即可)
Apr 16 Javascript
jquery 追加tr和删除tr示例代码
Sep 12 Javascript
jQuery实现的自定义弹出层效果实例详解
Sep 04 Javascript
d3.js中冷门却实用的内置函数总结
Feb 04 Javascript
ES6中Generator与异步操作实例分析
Mar 31 Javascript
微信小程序中的onLoad详解及简单实例
Apr 05 Javascript
基于ExtJs在页面上window再调用Window的事件处理方法
Jul 26 Javascript
Vue网页html转换PDF(最低兼容ie10)的思路详解
Aug 24 Javascript
基于three.js编写的一个项目类示例代码
Jan 05 Javascript
layui radio单选限制下一个radio单选的实例
Sep 03 Javascript
javascript History对象原理解析
Feb 17 Javascript
jdk1.8+vue elementui实现多级菜单功能
Sep 24 Javascript
js获取上传文件大小示例代码
Apr 10 #Javascript
JavaScript中双叹号(!!)作用示例介绍
Apr 10 #Javascript
js实现图片旋转的三种方法
Apr 10 #Javascript
javascript:void(0)的问题使用探讨
Apr 10 #Javascript
ajax请求乱码的解决方法(中文乱码)
Apr 10 #Javascript
php的文件上传入门教程(实例讲解)
Apr 10 #Javascript
JS使用replace()方法和正则表达式进行字符串的搜索与替换实例
Apr 10 #Javascript
You might like
sourcesafe管理phpproj文件的补充说明(downmoon)
2009/04/11 PHP
php的数组与字符串的转换函数整理汇总
2013/07/18 PHP
php打印输出棋盘的实现方法
2014/12/23 PHP
制作个性化的WordPress登陆界面的实例教程
2016/05/21 PHP
php 根据自增id创建唯一编号类
2017/04/06 PHP
PHP微信支付结果通知与回调策略分析
2019/01/10 PHP
js调试工具 Javascript Debug Toolkit 2.0.0版本发布
2008/12/02 Javascript
Mootools 1.2教程 同时进行多个形变动画
2009/09/15 Javascript
iframe的onload在Chrome/Opera中执行两次Bug的解决方法
2011/03/17 Javascript
javascript阻止浏览器后退事件防止误操作清空表单
2013/11/22 Javascript
node.js中的fs.readdirSync方法使用说明
2014/12/17 Javascript
jQuery中insertBefore()方法用法实例
2015/01/08 Javascript
js制作支付倒计时页面
2016/10/21 Javascript
扩展jquery easyui tree的搜索树节点方法(推荐)
2016/10/28 Javascript
vue.js的提示组件
2017/03/02 Javascript
ES6新特性之函数的扩展实例详解
2017/04/01 Javascript
[04:30]显微镜下的DOTA2第五期——拉比克
2013/09/26 DOTA
[01:08:00]Fnatic vs Winstrike 2018国际邀请赛小组赛BO2 第一场 8.18
2018/08/19 DOTA
python 读取摄像头数据并保存的实例
2018/08/03 Python
解决Pycharm下面出现No R interpreter defined的问题
2018/10/29 Python
python字典的遍历3种方法详解
2019/08/10 Python
Python Multiprocessing多进程 使用tqdm显示进度条的实现
2019/08/13 Python
10个Python面试常问的问题(小结)
2019/11/20 Python
Django实现后台上传并显示图片功能
2020/05/29 Python
浅析Python 序列化与反序列化
2020/08/05 Python
英国最大的百货公司:Harrods
2016/08/18 全球购物
体育老师的教学自我评价分享
2013/11/19 职场文书
自荐书模板
2013/12/19 职场文书
优秀员工获奖感言
2014/03/01 职场文书
2015年教学管理工作总结
2015/05/20 职场文书
教师考核鉴定意见
2015/06/05 职场文书
孔繁森观后感
2015/06/10 职场文书
同事离别感言
2015/08/04 职场文书
不知如何爱孩子,这些方法教会您
2019/08/06 职场文书
Python requests库参数提交的注意事项总结
2021/03/29 Python
python文件名批量重命名脚本实例代码
2021/04/22 Python