jquery实现全选反选功能---兰
2015-03-29 14:18
441 查看
<div id="checkAndInverCheck"> <p style="text-align:center; padding-top:15px"> 选择喜欢的兰花品种:</br> <input type="checkbox" value="蕙兰">蕙兰 <input type="checkbox" value="建兰">建兰</br> <input type="checkbox" value="寒兰">寒兰 <input type="checkbox" value="墨兰">墨兰</br> <input type="checkbox" value="春兰">春兰 <input type="checkbox" value="莲瓣兰">莲瓣兰 </div> <p style="text-align:center; padding-top:15px"> <input type="button" value="全选" name="ay_check" id="ay_check_all"/> <input type="button" value="反选" name="ay_check" id="ay_check_invert"/> </p> <script type="text/javascript"> //全选 $("input[name='ay_check']").bind("click",function(){ var btn_id = $(this).attr("id"); if(btn_id){ //点击全选按钮 if(btn_id == "ay_check_all"){ var inputs = $("#checkAndInverCheck input"); if(inputs.length == 0){ alert("div下没<input>元素,你想全选啥?"); }else{ for(var i in inputs){ inputs[i].checked=(inputs[i].checked)?"checked":"checked"; } } //点击反选按钮 }else if(btn_id == "ay_check_invert"){ var inputs = $("#checkAndInverCheck input"); if(inputs.length == 0){ alert("div下没<input>元素,你想反选啥?"); }else{ for(var i in inputs){ inputs[i].checked=(inputs[i].checked)?"":"checked"; } } }else{ alert("wrong!!!"); } } }); //全选 function checkAll(){ var inputs = $("#checkAndInverCheck input"); if(inputs.length == 0){ alert("div下没<input>元素,你想全选啥?"); }else{ for(var i in inputs){ inputs[i].checked=(inputs[i].checked)?"checked":"checked"; } } } //反选 function invertCheck(){ var inputs = $("#checkAndInverCheck input"); if(inputs.length == 0){ alert("div下没<input>元素,你想反选啥?"); }else{ for(var i in inputs){ inputs[i].checked=(inputs[i].checked)?"":"checked"; } } }
相关文章推荐
- 使用jquery实现全选,全不选,反选功能
- JQuery实现全选、全不选和反选功能
- jquery实现全选/反选功能
- Jquery 实现全选反选功能
- js, jQuery实现全选、反选功能
- jquery实现简单的全选和反选功能
- Jquery之实现全选反选功能
- Jquery实现checkbox的全选、反选功能代码
- 功能选中jquery实现全选反选功能
- jQuery实现全选反选功能
- JQuery实现全选,不选,反选功能
- jQuery实现checkbox列表的全选、反选功能
- jquery实现全选、全消、反选功能
- 关于用jQuery实现的checkbox全选和反选功能
- jQuery实现全选于反选功能
- jquery实现简单的全选和反选功能
- 基于jQuery实现复选框的全选 全不选 反选功能
- JQuery实现列表中复选框全选反选功能封装(推荐)
- jquery实现全选反选功能
- JQuery学习(4)全选反选功能的实现