【七】jquery之属性attr、 removeAttr、prop[全选全不选及反选]

全选全不选

界面：

代码：

<!DOCTYPE html>
<html>
<head><meta charset="UTF-8"><script type="text/javascript" src="jquery-3.3.1.js"></script>
</head>
<body><input type="checkbox" id="checkall" />全选/全不选<br/><input type="checkbox" name="items" value="足球"/>足球<input type="checkbox" name="items" value="篮球" />篮球<input type="checkbox" name="items" value="游泳" />游泳<input type="checkbox" name="items" value="唱歌" />唱歌<input type="checkbox" name="items" value="读书" />读书<br/><input type="button" id="checkall_1" value="全选"/><input type="button" id="checkno" value="全不选"/><input type="button" id="checkarev" value="反选"/><input type="button" id="send" value="提交"/><script type="text/javascript">//全选全不选
    $(document).ready(function(){$("#checkall").click(function(){if (($("#checkall").prop("checked"))){$(":input[name='items']").attr("checked",true);}else{$(":input[name='items']").attr("checked",false);}});});//全选
    $(document).ready(function(){$("#checkall_1").click(function(){            $(":input[name='items']").attr("checked",true);});});    //全不选
    $(document).ready(function(){$("#checkno").click(function(){    //方式一
            $(":input[name='items']").attr("checked",false);//方式二// $("input[name='checkbox']").removeAttr("checked");
        });});//反选
    $(document).ready(function(){$("#checkarev").click(function(){$("input[name='items']").each(function(){    //attr//1.attr("checked"):返回被选中元素的属性值    //2.attr("checked",true)：设置选中属性    if (this.checked) {$(this).prop("checked",false);}else{$(this).prop("checked",true);}});});});</script>
</body>
</html>

转载于:https://www.cnblogs.com/8013-cmf/p/8434712.html

【七】jquery之属性attr、 removeAttr、prop[全选全不选及反选]相关推荐

Jquery重新学习之二[属性attr(),removeAttr(),prop(),removeProp()]
1:属性.attr(name|pro|key,val|key,fn)与removeAttr(name) 1.1 .attr(name) 参数name为属性名称 <a id="my_hr ...
jQuery中的attr()与prop()设置属性、获取属性的区别
举例,比如我们要获取checkbox的属性或者设置checkbox选中或不选中. $("#editForm").find("input[type='checkbox']& ...
jquery中的attr()和prop()
2019独角兽企业重金招聘Python工程师标准>>> jQuery1.6中新添加了一个prop方法,看起来和用起来都和attr方法一样,这两个方法有什么区别呢?这要从HTMl 的a ...
jQuery实战之 attr() 和 prop() 的区别
是不是刚开始学jQuery的时候,看到了这两个方法:attr()和prop():感觉这不是一个意思吗?他们有什么区别呢? 下面简单的给大家区分一下: 对于HTML元素本身就带有的固有属性,在处理的时候 ...
【jQuery 区别】attr()和prop()的区别
1>>> 今天实现一个点击更新按钮 ,可以勾选上本行的的checkbox的功能: 使用代码: 1 /** 2 * updateproduct.htmls 更新产品信息 3 */ ...
【JQuery元素属性】
JQuery元素属性元素属性 attr removeAttr prop removeProp 元素属性 attr 设置或返回被选元素的属性值 <img src="https://ss ...
jquery中attr和prop以及removeAttr和removeProp的区别
结论:attr和prop都可以获取自定义对象的属性值,区别是attr能获取标签元素自定义属性,prop无法获取,返回undefined,它只能获取标签自带属性. removeAttr标签上的属性都可以 ...
JQuery基础-》带有案例-隔行换色-全选-QQ表情-下拉框左右移动
JQuery基础下面案例用到的资源包:https://download.csdn.net/download/weixin_44537122/11879014 1.内容 1. JQuery 基础:1. ...
jQuery attr removeAttr 属性操作
jQuery attr removeAttr 属性操作 <%@ page language="java" import="java.util.*" pag ...

【七】jquery之属性attr、 removeAttr、prop[全选全不选及反选]

【七】jquery之属性attr、 removeAttr、prop[全选全不选及反选]相关推荐

最新文章

热门文章