作用范围:
Readonly
只针对input
和textarea
有效,而disabled
对于所有的表单元素都有效。
表单中readOnly
和disabled
的区别:
Readonly
只针对input(text/ password)
和textarea
有效,而disabled
对于所有的表单元素都有效,包括select,radio, checkbox, button
等。
但是表单元素在使用了disabled
后,当我们将表单以POST
或GET
的方式提交的话,这个元素的值不会被传递出去,而readonly
会将该值传递出去(这种情况出现在我们将某个表单中的textarea
元素设置为disabled
或readonly
,但是submitbutton
却是可以使用的)。
js操作:
代码如下:
function disableElement(element,val){
document.getElementById(element).disabled=val;
}
jQuery进行操作:
代码如下:
//两种方法设置disabled属性
$('#areaSelect').attr("disabled",true);
$('#areaSelect').attr("disabled","disabled");
//三种方法移除disabled属性
$('#areaSelect').attr("disabled",false);
$('#areaSelect').removeAttr("disabled");
$('#areaSelect').attr("disabled","");
获取s:textfield
,并设置其disabled
属性:
代码如下:
functiondisableTextfieldofAccountDiv(element,val)
{
$(element).find(":textfield").attr('disabled',val);
}
jquery
根据多个class
获取元素
<div class = "a b"></div>
-
交集选择:
$(".a.b") --选择同时包含a和b的元素
。 -
并集选择:
$(".a, .b") --选择包含a或者包含b的元素
。
jquery
如何选择带有多个class
的元素
- 依次过滤
$(“.good”).filter(“.list”).filter(“.Card”)
- 属性选择
$(“[class='good list Card']“); //此处 顺序必须一致才行
- 直接
直接用$(“.good.list.Card”)
jQuery
用addClass
方法同时增加多个class
属性
一句话代码
$("#obj").addClass("className1 className2");
jQuery removeClass
移除多个标签
jQuery removeClass 技巧_移除多个标签
$('.xx').attr('class','a b c');
$('.xx').removeClass('a');
但是突然之间,需要我一次性清除掉两个class
,那么这个时候我就懵了,怎么在不影响之前存在的class
的情况下移除多个值呢?第一反应就是去w3cschool寻找答案,并获取了解决方法:
//只需要通过空格来间隔 class 值即可一次性清除掉多个 class
$('.xx').removeClass('a b c');
jQuery
多个类 选择器
实例
选取 class
为 "intro"、"demo"
或 "end"
的所有元素:
$(".intro,.demo,.end")
定义和用法
.class
选择器可用于选取多个 class
。
注意:用逗号分隔每个 class
。
注意:不要使用数字开头的 class
属性!在某些浏览器中可能出问题。
语法
$(".class1,.class2,.class3,...")
jQuery
选择input
的class
属性写了多个值的情况
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="js/jquery-1.6.2.js" type="text/javascript"></script>
<style type="text/css">
.content {
text-align: left;
font-weight: normal;
color: #000000;
font-size: 9pt;
vertical-align: bottom;
}
.my_sh {
}
</style>
<script type="text/javascript">
function getClassVal(){
jQuery("#1").val(); //只能取到一个id的值
jQuery(".content.my_sh").show(); //可以显示所有input框
}
</script>
</head>
<body>
<input type="text" id="1" class="content my_sh" value="1" />
<input type="text" id="2" class="content my_sh" value="2" />
<input type="text" id="3" class="content my_sh" value="3" />
<input type="text" id="4" class="content my_sh" value="4" />
</body>
</html>
【注】:input中的class属性中的多个值之间要有空格,jQuery在取值的时候每个class值之间不能有空格。
JQuery
禁止/恢复按钮readonly
和disabled
小结
禁止/恢复按钮
其实就是更改 的属性。
禁用 id
为 btn
的按钮:
$("#btn").attr({"disabled":"disabled"});
//或者
$("#btn").attr("disabled","disabled");
取消禁用:
```javascript
$("#btn").removeAttr("disabled");
//或者
$("#btn").attr("disabled","");
JQuery对元素应用disabled和readonly属性的方法:
1.readonly
$(‘input’).attr(“readonly”,”readonly”)//将input元素设置为readonly
$(‘input’).removeAttr(“readonly”);//去除input元素的readonly属性
if($(‘input’).attr(“readonly”)==true)//判断input元素是否已经设置了readonly属性
对于为元素设置readonly
属性和取消readonly
属性的方法还有如下两种:
$(‘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
$(‘input’).attr(“disabled“,”disabled“)//将input元素设置为disabled
$(‘input’).removeAttr(“disabled“);//去除input元素的disabled属性
if($(‘input’).attr(“disabled“)==true)//判断input元素是否已经设置了disabled属性
对于为元素设置disabled
属性和取消disabled
属性的方法还有如下两种:
$(‘input’).attr(“disabled“,true)//将input元素设置为disabled
$(‘input’).attr(“disabled“,false)//去除input元素的disabled属性
$(‘input’).attr(“disabled“,”disabled“)//将input元素设置为disabled
$(‘input’).attr(“disabled“,”")//去除input元素的disabled属性