JQuery(全选与反选功能)
<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script src="../js/jquery-1.8.3.js" type="text/javascript"></script> <title></title> <script type="text/javascript"> $(function () { /*全选功能的实现*/ $("#all").click(function () { $(".item").attr("checked", $("#all").prop("checked")); }); /*当checkbox全部被选中时,全选被勾选,否则不配勾选*/ $(".item").click(function () { if ($("input[class='item']:checked").size() == 7) { $("#all").attr("checked", true); } else { $("#all").attr("checked", false); } }); /*反选功能的实现*/ $("#ops").click(function () { $(".item").each(function () { $(this).attr("checked", !this.checked); }); }); }); </script></head><body> <label>全选</label><input type="checkbox" id="all" /><br /> <label>反选</label><input type="checkbox" id="ops" /><br /> <label>1,</label><input type="checkbox" class="item" /><br /> <label>2,</label><input type="checkbox" class="item" /><br /> <label>3,</label><input type="checkbox" class="item" /><br /> <label>4,</label><input type="checkbox" class="item" /><br /> <label>5,</label><input type="checkbox" class="item" /><br /> <label>6,</label><input type="checkbox" class="item" /><br /> <label>7,</label><input type="checkbox" class="item" /><br /></body></html>