首页 | 新闻 | 新品 | 文库 | 方案 | 视频 | 下载 | 商城 | 开发板 | 数据中心 | 座谈新版 | 培训 | 工具 | 博客 | 论坛 | 百科 | GEC | 活动 | 主题月 | 电子展
返回列表 回复 发帖

JS----checked----checked选中和未选中的获取(1)

JS----checked----checked选中和未选中的获取(1)

全选、全不选、反选功能

html代码
<form action="" id="oForm" name="myForm">
        <input type="checkbox" name="hobby" id="basket" value="basket">篮球<Br>
        <input type="checkbox" name="hobby" id="zuqiu" value="zuqiu" >足球<Br>
        <input type="checkbox" name="hobby" id="paiqiu" value="paiqiu">排球<Br>
        <input type="checkbox" name="hobby" id="wqiu" value="wqiu">网球<Br>
        <input type="checkbox" name="hobby" id="biqiu" value="biqiu">壁球<Br>
        <input type="checkbox" name="hobby" id="bpq" value="bpq">乒乓球<Br>
        <input type="checkbox" name="hobby" id="ymq" value="ymq">羽毛球<Br>
        <input type="button" name="all" id="all" value='全选'>
        <input type="button" name="allNo" id="allNo" value='全不选'>
        <input type="button" name="noCheck" id="noCheck" value='反选'>
  </form>




JS代码
function setVal(iNum){
        var aForm = document.getElementById("myForm");
        var aArr = aForm.hobby;   
        for(var i=0;i<aArr.length;i++){        
            if( iNum<0 ){
                aArr[i].checked = !aArr[i].checked;   
            }else{
                aArr[i].checked = iNum;
            }           
        }
    }



设置选中
下边两种写法没有任何区别 只是少了些代码而已
<input id="cb1" type="checkbox" checked />
<input id="cb2" type="checkbox" checked="checked" />


jquery赋值checked的几种写法:
所有的jquery版本都可以这样赋值:
// $("#cb1").attr("checked","checked");
// $("#cb1").attr("checked",true);


jquery1.6+:prop的4种赋值:
// $("#cb1").prop("checked",true);//很简单就不说了哦
// $("#cb1").prop({checked:true}); //map键值对
// $("#cb1").prop("checked",function(){
return true;//函数返回true或false
});
//$("#cb1").prop("checked","checked");



为什么input checkbox有 checked='checked'还是没选中
如果用jQuery1.6+来写的话:
建议使用
$(element).prop('checked', true/false);
而不是
$(element).attr('checked', true/false);
其实也就相当于要使用:
element.checked = true/false;
而并不是
element.setAttribute('checked', true/false/'checked');





jquery判断checked的三种方法
.attr('checked'):   //看版本1.6+返回:"checked"或"undefined" ;1.5-返回:true或false
.prop('checked'): //16+:true/false
.is(':checked'):    //所有版本:true/false//别忘记冒号哦




jQuery获取未选中的checkbox
$('input[type=checkbox]').not("input:checked");  




jQuery获取选中的checkbox
$('input[type=checkbox]:checked');






jquery官网checked的用法
http://api.jquery.com/checked-selector/
返回列表