码迷,mamicode.com
首页 > Web开发 > 详细

关于jQuery表单选择中prop和attr的区别。

时间:2017-05-07 17:32:48      阅读:167      评论:0      收藏:0      [点我收藏+]

标签:family   单选   attr   努力   jquery学习   for   func   找不到   全选   

   今天用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的区别。

标签:family   单选   attr   努力   jquery学习   for   func   找不到   全选   

原文地址:http://www.cnblogs.com/wyw0304-/p/6821249.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!