类别：前端知识
日期：2022-04-03 浏览：2338 评论：0
jQuery是一个快速、简洁的JavaScript框架，是继Prototype之后又一个优秀的JavaScript代码库（框架）于2006年1月由John Resig发布。jQuery设计的宗旨是“write Less，Do More”，即倡导写更少的代码，做更多的事情。它封装JavaScript常用的功能代码，提供一种简便的JavaScript设计模式，优化HTML文档操作、事件处理、动画设计和Ajax交互。
jquery api中提供了对元素应用disabled和readonly属性的方法：
1，readonly
代码示例:
1 2 3 | $('input').attr("readonly","readonly")//将input元素设置为readonly $('input').removeAttr("readonly");//去除input元素的readonly属性 if($('input').attr("readonly")==true)//判断input元素是否已经设置了readonly属性 |
对于为元素设置readonly属性和取消readonly属性的方法还有如下两种：
代码示例:
1 2 3 4 5 | $('input').attr("readonly",true)//将input元素设置为readonly $('input').attr("readonly",false)//去除input元素的readonly属性 $('input').attr("readonly","readonly")//将input元素设置为readonly $('input').attr("readonly","")//去除input元素的readonly属性 |
2，disabled
代码示例:
1 2 3 4 | $('input').attr("disabled","disabled")//将input元素设置为disabled $('input').removeAttr("disabled");//去除input元素的disabled属性 if($('input').attr("disabled")==true)//判断input元素是否已经设置了disabled属性 |
对于为元素设置disabled属性和取消disabled属性的方法还有如下两种：
代码示例:
1 2 3 4 5 | $('input').attr("disabled",true)//将input元素设置为disabled $('input').attr("disabled",false)//去除input元素的disabled属性 $('input').attr("disabled","disabled")//将input元素设置为disabled $('input').attr("disabled","")//去除input元素的disabled属性 |
3，关于checkbox的（checkbox看是否为一组是用name值相同来判断的）
因为checkbox本身并没有提供readonly方法，而用了disabled会变成灰色，所以找了俩个方法
方式一：
checkbox没有readOnly属性，如果使用disabled=“disabled”属性的话，会让checkbox变成灰色的，用户很反感这种样式可以这样让它保持只读：
设置：onclick="return false"
js中：checkbox.onclick=function(){return false;};
方式二：
代码示例:
1 2 3 4 5 6 7 8 9 10 11 | <script src="Demo3.1/jquery-1.4.2.min.js" type="text/javascript"></script> <script language="javascript"> $(function(){ $("input[type='checkbox']").click( function(){ this.checked = !this.checked; } ); } ); </script> |
4，select设置只读
使用disabled吧，没有找到类似checkbox这种方案，取值只好用hidden了。
本文标题：jquery设置元素readonly和disabled(checkbox只读)
本文链接：https://vtzw.com/post/947.html
版权声明：本文不使用任何协议授权，您可以任何形式自由转载或使用。
您阅读本篇文章共花了： 
发表评论 / 取消回复