html5中文学习网

您的位置: 首页 > 网站及特效实例 > javascript特效 » 正文

jquery操作checked属性以及disabled属性的多种方法_jquery_

[ ] 已经帮助:人解决问题

下边两种写法没有任何区别 只是少了些代码而已...awZHTML5中文学习网 - HTML5先行者学习网

复制代码 代码如下:
awZHTML5中文学习网 - HTML5先行者学习网
<input id="cb1" type="checkbox" checked />awZHTML5中文学习网 - HTML5先行者学习网
<input id="cb2" type="checkbox" checked="checked" />awZHTML5中文学习网 - HTML5先行者学习网
awZHTML5中文学习网 - HTML5先行者学习网

jquery判断checked的三种方法:awZHTML5中文学习网 - HTML5先行者学习网

复制代码 代码如下:
awZHTML5中文学习网 - HTML5先行者学习网
.attr('checked'):   //看版本1.6+返回:"checked"或"undefined" ;1.5-返回:true或falseawZHTML5中文学习网 - HTML5先行者学习网
.prop('checked'): //16+:true/falseawZHTML5中文学习网 - HTML5先行者学习网
.is(':checked'):    //所有版本:true/false//别忘记冒号哦awZHTML5中文学习网 - HTML5先行者学习网
awZHTML5中文学习网 - HTML5先行者学习网

jquery赋值checked的几种写法:awZHTML5中文学习网 - HTML5先行者学习网

所有的jquery版本都可以这样赋值:awZHTML5中文学习网 - HTML5先行者学习网

复制代码 代码如下:
awZHTML5中文学习网 - HTML5先行者学习网
$("#cb1").attr("checked","checked");awZHTML5中文学习网 - HTML5先行者学习网
$("#cb1").attr("checked",true);awZHTML5中文学习网 - HTML5先行者学习网
awZHTML5中文学习网 - HTML5先行者学习网

jquery1.6+:prop的4种赋值:awZHTML5中文学习网 - HTML5先行者学习网

复制代码 代码如下:
awZHTML5中文学习网 - HTML5先行者学习网
$("#cb1").prop("checked",true);    //很简单就不说了哦awZHTML5中文学习网 - HTML5先行者学习网
$("#cb1").prop({checked:true});    //map键值对awZHTML5中文学习网 - HTML5先行者学习网

$("#cb1").prop("checked",function(){awZHTML5中文学习网 - HTML5先行者学习网
    return true;    //函数返回true或falseawZHTML5中文学习网 - HTML5先行者学习网
});awZHTML5中文学习网 - HTML5先行者学习网

$("#cb1").prop("checked","checked");awZHTML5中文学习网 - HTML5先行者学习网

awZHTML5中文学习网 - HTML5先行者学习网

更多参考:http://api.jquery.com/prop/awZHTML5中文学习网 - HTML5先行者学习网

复制代码 代码如下:
awZHTML5中文学习网 - HTML5先行者学习网
<html>awZHTML5中文学习网 - HTML5先行者学习网
    <head>awZHTML5中文学习网 - HTML5先行者学习网
        <title>测试</title>awZHTML5中文学习网 - HTML5先行者学习网
        <style type="text/css">awZHTML5中文学习网 - HTML5先行者学习网

        </style>awZHTML5中文学习网 - HTML5先行者学习网
        <!--1.62可以修改1.42  1.52  1.7来测试-->awZHTML5中文学习网 - HTML5先行者学习网
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>awZHTML5中文学习网 - HTML5先行者学习网
        <script type="text/javascript">awZHTML5中文学习网 - HTML5先行者学习网
        $(function(){awZHTML5中文学习网 - HTML5先行者学习网
            //判断checkedawZHTML5中文学习网 - HTML5先行者学习网
       //    var a=$("#cb1").attr('checked'); //看版本1.6+返回:"checked"或"undefined" ;1.5-返回:true或falseawZHTML5中文学习网 - HTML5先行者学习网
       //    var b=$("#cb1").prop('checked'); //1.6+:true/falseawZHTML5中文学习网 - HTML5先行者学习网
       var c=$("#cb1").is(':checked');  //所有版本:true/falseawZHTML5中文学习网 - HTML5先行者学习网
       //    alert(a);        awZHTML5中文学习网 - HTML5先行者学习网
       //    alert(b);awZHTML5中文学习网 - HTML5先行者学习网
            alert(c);awZHTML5中文学习网 - HTML5先行者学习网
           //赋值   前两个所有的jquery版本都支持 prop只有jquery1.6+支持awZHTML5中文学习网 - HTML5先行者学习网
       //    $("#cb1").attr("checked","checked");//1.5-awZHTML5中文学习网 - HTML5先行者学习网
       //    $("#cb1").attr("checked",true);//1.5-awZHTML5中文学习网 - HTML5先行者学习网
       //   $("#cb1").prop("checked","checked");//1.6+(整理的时候把这个忘记啦)awZHTML5中文学习网 - HTML5先行者学习网
       //    $("#cb1").prop("checked",true);//1.6+awZHTML5中文学习网 - HTML5先行者学习网
       //    $("#cb1").prop({checked:true});//1.6+awZHTML5中文学习网 - HTML5先行者学习网
       //    $("#cb1").prop("checked",function(){awZHTML5中文学习网 - HTML5先行者学习网
       //        return  true;//1.6+awZHTML5中文学习网 - HTML5先行者学习网
       //    });                awZHTML5中文学习网 - HTML5先行者学习网
        })();awZHTML5中文学习网 - HTML5先行者学习网
    awZHTML5中文学习网 - HTML5先行者学习网
        </script>awZHTML5中文学习网 - HTML5先行者学习网
    </head>awZHTML5中文学习网 - HTML5先行者学习网
    <body>awZHTML5中文学习网 - HTML5先行者学习网
        <!--赋值的时候记得去掉checked-->awZHTML5中文学习网 - HTML5先行者学习网
    <input id="cb1" type="checkbox" checked />awZHTML5中文学习网 - HTML5先行者学习网
    <input id="cb2" type="checkbox" checked="checked"/>awZHTML5中文学习网 - HTML5先行者学习网
    </body>awZHTML5中文学习网 - HTML5先行者学习网
</html>awZHTML5中文学习网 - HTML5先行者学习网

awZHTML5中文学习网 - HTML5先行者学习网

(责任编辑:)
推荐书籍
推荐资讯
关于HTML5先行者 - 联系我们 - 广告服务 - 友情链接 - 网站地图 - 版权声明 - 人才招聘 - 帮助