CHECKBOX 的全選、取消及跨頁(yè)保存的實(shí)現(xiàn)方法
更新時(shí)間:2013年10月16日 17:32:59 作者:
CHECKBOX的操作在頁(yè)面中很常見,比如全選、取消、跨頁(yè)保存等等,下面有個(gè)不錯(cuò)的示例,大家可以嘗試操作下
復(fù)制代碼 代碼如下:
<script>
$(document).ready(function () {
/**
*全選checkbox
*/
$(".checkall").live("click", function () {
if ($(this).attr("checked") == "checked") {//如果選中
CheckAll();
} else {
UnCheckAll();
}
UpdateHfValues();
});
$(".checkone").each(function () {
$(this).live("click", function () {
CheckOne();
UpdateHfValues();
});
});
function UnCheckAll() {
//取消全選
$(".checkone").each(function () {
$(this).removeAttr("checked");
});
}
function CheckAll() {
//全選
$(".checkone").each(function () {
$(this).attr("checked", "checked");
});
}
function CheckOne() {
//單擊單條消息時(shí)檢驗(yàn)是否全選
var $length = $(".checkone").length;
var $checklenght = $(".checkone:checked").length;
if ($length == $checklenght) {
$(".checkall").attr("checked", "checked");
} else {
$(".checkall").removeAttr("checked");
}
}
var arr = $("#hfDel").val().split(",");
$(".checkone").each(function () {
var i = 0;
for (i = 0; i < arr.length; i++) {
if (arr[i] == $(this).val()) {
$(this).attr("checked", "checked");
}
}
});
var checkedNum = $(".checkone:checked").length;
var allNum = $(".checkone").length;
if (checkedNum == allNum) {
$(".checkall").attr("checked", "checked");
}
function UpdateHfValues() {
var $checkOneLen = $(".checkone:checked").length;
var $conVal = "";
$(".checkone:checked").each(function (i) {
$conVal += $(this).val() + ",";
});
if ($conVal.length > 0) {
$conVal = $conVal.substring(0, $conVal.length - 1);
}
$conVal = $conVal + "," + $("#hfDel").val();
var allArray = $conVal.split(",");
$(".checkone").each(function () {
if (typeof $(this).attr("checked") != "undefined" && $(this).attr("checked") == "checked") {
var i = 0;
var find = false;
for (i = 0; i < allArray.length; i++) {
if (allArray[i] == $(this).val()) {
find = true;
}
}
if (find == false) {
allArray.push($(this).val());
}
}
else {
var i = 0;
for (i = 0; i < allArray.length; i++) {
if (allArray[i] == $(this).val()) {
allArray[i] = "";
}
}
}
});
var i = 0;
var result = "";
for (i = 0; i < allArray.length; i++) {
if (allArray[i] != "") {
result += allArray[i] + ",";
}
}
if (result.length > 0) {
result = result.substring(0, result.length - 1);
}
$("#hfDel").val(result);
}
function UpdateValues() {
alert($("#hfDel").val());
var $checkOneLen = $(".checkone:checked").length;
var $conVal = "";
$(".checkone:checked").each(function (i) {
$conVal += $(this).val() + ",";
});
$conVal = $conVal.substring(0, $conVal.length - 1);
$("#hfDel").val($conVal);
}
$("#btnDeletes").unbind("click").live("click", function () {
if ($("#hfDel").val() != "") {
if (confirm("確定要啟用用選中的選項(xiàng)嗎?")) {
return true;
} else {
return false;
}
} else {
alert("您尚未選中要啟用的選項(xiàng)!");
return false;
}
});
$("#lbTingYong").unbind("click").live("click", function () {
if ($("#hfDel").val() != "") {
if (confirm("確定要停用選中的選項(xiàng)嗎?")) {
return true;
} else {
return false;
}
} else {
alert("您尚未選中要停用的選項(xiàng)!");
return false;
}
});
});
<script>
<input type="checkbox" id="ckAll" class="checkall" onclick="checkAll(this)" /></div>
<input type="checkbox" id="iCheck" class="checkone" value='<%#Eval("cSubjectDetailID") %>' />
<asp:HiddenField ID="hfDel" runat="server" />
相關(guān)文章
.NET單元測(cè)試使用AutoFixture按需填充的幾種方式和最佳實(shí)踐記錄
AutoFixture是一個(gè).NET庫(kù),旨在簡(jiǎn)化單元測(cè)試中的數(shù)據(jù)設(shè)置過程,通過自動(dòng)生成測(cè)試數(shù)據(jù),它幫助開發(fā)者減少測(cè)試代碼的編寫量,使得單元測(cè)試更加簡(jiǎn)潔、易讀和易維護(hù),本文介紹.NET單元測(cè)試使用AutoFixture按需填充的幾種方式和最佳實(shí)踐記錄,感興趣的朋友一起看看吧2024-07-07
.NET 6開發(fā)TodoList應(yīng)用之實(shí)現(xiàn)API版本控制
API接口版本管理,對(duì)于一些規(guī)模稍大的企業(yè)應(yīng)用來(lái)說,是經(jīng)常需要關(guān)注的一大需求。本文將介紹在.NET 6開發(fā)中如何實(shí)現(xiàn)API版本控制,感興趣的可以了解一下
2022-01-01
VS2015+Qt5+OpenCV3開發(fā)環(huán)境配置
這篇文章主要為大家詳細(xì)介紹了VS2015+Qt5+OpenCV3開發(fā)環(huán)境配置,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下
2019-06-06
ASP.NET Core SignalR中的流式傳輸深入講解
這篇文章主要給大家介紹了關(guān)于ASP.NET Core SignalR中流式傳輸?shù)南嚓P(guān)資料,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
2018-11-11
System.Timers.Timer定時(shí)執(zhí)行程序示例代碼
如果是某個(gè)邏輯功能的定時(shí),可以將code放到邏輯功能的類的靜態(tài)構(gòu)造函數(shù)中,在該邏輯類第一次執(zhí)行時(shí),靜態(tài)構(gòu)造函數(shù)會(huì)被調(diào)用,則定時(shí)自然啟動(dòng)
2013-06-06
Automation服務(wù)器不能創(chuàng)建對(duì)象的多種解決辦法
這篇文章主要介紹了Automation服務(wù)器不能創(chuàng)建對(duì)象的多種解決辦法,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
2020-01-01 
