你的位置:首页 > Java教程

[Java教程]jquery全选、反选、全不选


jquery全选、反选、全不选简单实现

Jquery代码

!function ($) {  //全选 反选 全不选  $("#selAll").click(function () {    $(".lists :checkbox").not(':disabled').prop("checked", true);  });  $("#unSelAll").click(function () {    $(".lists :checkbox").not(':disabled').prop("checked", false);  });  $("#reverSel").click(function () {    //遍历.lists下的 checkbox;    $(".lists :checkbox").not(':disabled').each(function () {      $(this).prop("checked", !$(this).prop("checked"));    });  });}(jQuery)

html

<input id="selAll" type="button" value="全选" /><input id="unSelAll" type="button" value="全不选" /><input id="reverSel" type="button" value="反选" /><div >  <input type="checkbox" value="1" /> 苹果  <input type="checkbox" value="2" /> 香蕉  <input type="checkbox" value="3" /> 菠萝  <input type="checkbox" value="4" /> 桃子</div>