时间:2021-05-26
<!-- 本文例子所引用的jQuery版本为 jQuery-1.8.3.min.js -->
一. 复合选择器对checkbox的相关操作
<input type="checkbox" id="ckb_1" /> <input type="checkbox" id="ckb_2" disabled="true" /> <input type="checkbox" id="ckb_3" /> <input type="checkbox" id="ckb_4" /> <input type="button" id="btn" value="点击">例.需要把类型为checkbox,同时"可用"的元素设置成"已选择"
方法①使用属性过滤选择器 [type='checkbox'] 和 [disabled!=disabled]
$("input[type='checkbox'][disabled!=disabled]").attr("checked",true);注意在这个复合选择器中,"可用"元素的选择应使用 disabled!=disabled,而设置属性时应使用 attr("checked",true)。disabled属性和checked属性的用法类似。
方法②使用表单选择器 :checkbox 和属性过滤选择器 [disabled!=disabled]
$('input:checkbox[disabled!=disabled]').attr("checked",true);方法③使用表单选择器 :checkbox 和表单对象属性过滤选择器 :enabled
$(':checkbox:enabled').attr("checked",true);方法④使用.each()遍历
$("input[type=checkbox]").each(function(){if ($(this).attr("disabled") != "disabled") {$(this).attr("checked",true);}});没用到复合选择器。需要注意的和方法①中一样,在判断属性时应该判断是"disabled"还是"enable",而不是false或true。而设置属性时既可以用"disabled"或"enable",也可以用false或true。
二. 复合选择器的其他例子
<ul><li >第一行</li><li class="showli">第二行</li><li class="showli">第三行</li><li>第四行</li><li style="display:none">第五行</li><li class="showli">第六行</li><li>第七行</li></ul>例. 把第一个class为showli的li元素背景设为红色
$("ul li[class=showli]:eq(0)").css("background":"red");结果是'<li class="showli">第二行</li>'的背景变成了红色。使用了属性过滤选择器 [class=showli] 和基本过滤选择器 eq(0)
例. 把第五个可见的li的背景设为红色
$("ul li:visible:eq(4)").css({"display":"blaock","background":"red"});结果是'<li class="showli">第六行</li>'的背景变成了红色,display:block是为了检测隐藏的li是否会被:visible过滤,display:none下是看不到红色背景的。使用了可见性过滤选择器 :visible
例.(比较绕的)把第二个class为showli的li后面可见的第二个li的背景设成红色
$("ul li.showli:eq(1)").nextAll("li:visible:eq(1)").css({"display":"block","background":"red"});结果是'<li class="showli">第六行</li>'的背景变成了红色。
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
本文实例讲述了jQuery中复合选择器简单用法。分享给大家供大家参考,具体如下:一介绍复合选择器将多个选择器(可以是ID选择器、元素选择或是类名选择器)组合在一
通配选择器 和很多语言一样,“*”这个符号在CSS里代表所有,即通配选择器。 例子: *{font-size:12px;} 这个例子表示将网页中所有
本文实例讲述了jQuery表单元素过滤选择器用法。分享给大家供大家参考,具体如下:前面jQuery内容过滤选择器与子元素过滤选择器,其中的例子稍微多一些解释也有
今天学习jQuery的选择器:jQuery选择器分为基本选择器、层次选择器、过滤选择器、表单选择器。基本选择器:id,class,标签名,*,元素组合(div,
jQuery元素选择器和属性选择器允许您通过标签名、属性名或内容对HTML元素进行选择。jQuery元素选择器:jQuery使用CSS选择器来选取HTML元素。