今天用jQuery学习表单这一章节的内容，再次遇到表单全选时，不能进行第二次全选的情况。反复查看测试仍然找不到是什么原因。后来在网上查到原来是jQuery1.6以后的版本用到的是prop。用attr的话不会多次实现，因为attr不会记录当前checkbox的选中状态。

表单这一章节内容让我感觉到有点吃力，总之好好努力吧！

以下是代码说明：

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>复选框</title>

    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js" ></script>

    <script type="text/javascript">

    $(function(){

        //使用attr

        /*$("#CheckedAll").click(function(){

            if(this.checked){

                $('[name=items]:checkbox').attr('checked',false);

            } else {

                $('[name=items]:checkbox').attr('checked',true);

            }

        });*/

        //使用prop

        $("#CheckedAll").click(function(){

            if(this.checked){

                $('[name=items]:checkbox').prop('checked',false);

            } else {

                $('[name=items]:checkbox').prop('checked',true);

            }

        });*/

    });

    </script>

</head>

<body>

    <form>

        你爱好的运动是？<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="乒乓球">乒乓球<br>

        <input type="button" id="CheckedAll" value="全 选">

        <input type="button" id="CheckedNo" value="全部选">

        <input type="button" id="CheckedRev" value="反 选">

        <input type="button" id="send" value="提 交">

    </form>

</body>

</html>

有关与attribute和property的区分可参考：http://www.tuicool.com/articles/3uuQRr6

关于jQuery表单选择中prop和attr的区别。的更多相关文章

  1. jquery中prop和attr的区别

    jquery中prop和attr的区别 prop: prop(name|properties|key,value|fn) **概述** 获取在匹配的元素集中的第一个元素的属性值. 随着一些内置属性的D ...

  2. 表单提交中get与post的区别

    在Form里面,可以使用post也可以使用get.它们都是method的合法取值. 1. get是从服务器上获取数据,post是向服务器传送数据.   2. get是把参数数据队列加到提交表单的ACT ...

  3. Jquery 获取Checkbox值，prop 和 attr 函数区别

    总结: 版本 1.6 1.6 1.4 1.4 函数 勾选 取消勾选 勾选 取消勾选 attr('checked') checked undefined true false .prop('checke ...

  4. jquery中prop()和attr()的区别

    相比attr,prop是1.6.1才新出来的,两者从中文意思理解,都是获取/设置属性的方法(attributes和properties).只是,window或document中使用.attr()方法在 ...

  5. 第82天：jQuery中prop()和attr()的区别

    在高版本的jquery引入prop方法后,什么时候该用prop?什么时候用attr?它们两个之间有什么区别?这些问题就出现了. 关于它们两个的区别,网上的答案很多.这里谈谈我的心得,我的心得很简单: ...

  6. jq中.prop()与attr()的区别

    一,定义 prop() 方法设置或返回被选元素的属性和值.prop() 方法应该用于检索属性值 attr()  方法设置或返回被选元素的属性和值.如需检索 HTML 属性,请使用 attr() 方法代 ...

  7. jq中prop和attr的区别以及各自的使用

    在高版本的jquery引入prop方法后,什么时候该用prop?什么时候用attr?它们两个之间有什么区别?这些问题就出现了. 关于它们两个的区别,网上的答案很多.这里谈谈我的心得,我的心得很简单: ...

  8. jQ中prop与attr的区别

    1.prop适用于HTML元素本身就带有的固有属性 2.attr适用于HTML元素我们自定义的属性 <input type="checkbox" value="复选 ...

  9. python_way day17 jQuery表单验证，事件绑定，插件，文本框架，正则表达式

    python_way day17 1.jQuery表单验证 dom事件绑定 jquery事件绑定 $.each return值的判断 jquery扩展方法 2.前段插件 3.jDango文本框架 4. ...

随机推荐

  1. C# WebClient、jQuery ajax jsonp实现跨域

    WebClient 无传输数据获取 Uri uri = new Uri(allURL); WebClient wc = new WebClient(); wc.Encoding = System.Te ...

  2. Spring+SpringMVC+MyBatis+easyUI整合优化篇（七）图片上传功能

    日常啰嗦 前一篇文章<Spring+SpringMVC+MyBatis+easyUI整合优化篇(六)easyUI与富文本编辑器UEditor整合>讲了富文本编辑器UEditor的整合与使用 ...

  3. C#并行编程--命令式数据并行（Parallel.Invoke）

    命令式数据并行   Visual C# 2010和.NETFramework4.0提供了很多令人激动的新特性,这些特性是为应对多核处理器和多处理器的复杂性设计的.然而,因为他们包括了完整的新的特性,开 ...

  4. JAVA常用集合源码解析系列-ArrayList源码解析（基于JDK8）

    文章系作者原创,如有转载请注明出处,如有雷同,那就雷同吧~(who care!) 一.写在前面 这是源码分析计划的第一篇,博主准备把一些常用的集合源码过一遍,比如:ArrayList.HashMap及 ...

  5. HashMap 构造函数

    HashMap总共提供了三个构造函数 /** * Constructs an empty <tt>HashMap</tt> with the default initial c ...

  6. 从JDBC到hibernate再到mybatis之路

    一.传统的JDBC编程 在java开发中,以前都是通过JDBC(Java Data Base Connectivity)与数据库打交道的,至少在ORM(Object Relational Mappin ...

  7. 【Uva 10498】满意值

    Description Kaykobad教授把为ACM选手买饭的任务交给了Nasa.Nasa决定买n种不同的食物.然后他询问了m名选手对每种食物的需求量.选手们当然不会给出任何符合逻辑的回答,他们只是 ...

  8. <CentOS7>如何设置hostname

    在CentOS/RHEL 7中,有个叫hostnamectl的命令行工具,它允许你查看或修改与主机名相关的配置: ceph@client-node ~]$ hostnamectlstatus Stat ...

  9. Mysql PHP

    if(_mysql.query(sql.data()) < 0) 这里不能使用sql.c_str() 因为这个会有‘\0’而在Mysql查询中,这个0是不希望出现的.

  10. spring cloud 集成 swagger2 构建Restful APIS 说明文档

    在Pom.xml文件中引用依赖 <dependencies> <dependency> <groupId>org.springframework.cloud< ...