jQuery实现复选框的全选、单选与反选、批量删除

由 **Admin** 周一六月 26, 2017 5:09 am

代码:: // --- 列头全选框被单击 --- function ChkSelectAll(subName, chkAllId){ var arrSub = document.getElementsByName(subName); var chkAll = document.getElementById(chkAllId); var tempStatus=chkAll.checked; for(i=0;i<arrSub.length;i++) { if(arrSub[i].checked!=tempStatus) arrSub[i].click(); } } // --- 子项复选框被单击 --- function ChkSubClick(subName, chkAllId) { var arrSub = document.getElementsByName(subName); var chkAll = document.getElementById(chkAllId); for(var i=0; i<arrSub.length; i++) { if(!arrSub[i].checked) { chkAll.checked = false; return; } } chkAll.checked = true; } // --- 反选被单击 --- function ChkSelectInverse(subName){ var arrSub = document.getElementsByName(subName); for(i=0;i<arrSub.length;i++) { arrSub[i].click(); } }

代码:: // JavaScript Document $(document).ready(function() { // 全选 $("#allChk").click(function() { $("input[name='subChk[]']").prop("checked",this.checked); }); // 单选 var subChk = $("input[name='subChk[]']") subChk.click(function() { $("#allChk").prop("checked", subChk.length == subChk.filter(":checked").length ? true:false); }); /* 批量删除 */ $("#del_model").click(function() { // 判断是否至少选择一项 var checkedNum = $("input[name='subChk[]']:checked").length; if(checkedNum == 0) { alert("请选择至少一项！"); return; } // 批量选择 if(confirm("确定要删除所选项目？")) { var checkedList = new Array(); $("input[name='subChk[]']:checked").each(function() { checkedList.push($(this).val()); }); $.ajax({ type: "POST", url: "../models/delete.php", data: {'items':checkedList}, success: function(result) { alert(result); window.location.reload(); } }); } }); });