我有一組復選框。我需要根據復選框的文本值檢查這些框。例如，如果我有三個帶有文本“Checkbox 01.”、“Checkbox 02”的復選框。和“復選框 03”。我有一個名為“全選”的復選框。我想遍歷復選框陣列，只檢查包含單詞“02”的專案。或“03”。
我不精通 JQuery，我繼承了這個，但我嘗試了代碼，這是我嘗試過的：
$(".rightColumn .SelectAllGroups").on("click", function () {
if (this.checked) {
$(".GroupSelection input:checkbox").each(function (i) {
//alert("Index of item" i);
if (this(i).val.contains("01.") || this(i).val.contains("02.") || this(i).val.contains("03.") ||
this(i).val.contains("04.") || this(i).val.contains("05.") || this(i).val.contains("06.") || this(i).val.contains("07 .") ||
this(i).val.contains("08.") || this(i).val.contains("09.") || this(i).val.contains("10.") || this(i).val.contains("11.")) {
this(i).checked = i;
}
});
} else {
$(".GroupSelection input:checkbox").each(function () {
this.checked = false;
});
}
});
僅供參考，值“07”。確實有一個空間，而其他人則沒有。當我運行它時，我收到錯誤“這不是函式”。文本框是通過代碼創建的。這是一個文本框的結果
<input name="ctl00$ctl00$ctl00$mainBody$mainContent$main$newEpisodeForm$NewSnapshot$GroupSelection$groupTypeList$ctl01$groupList$ctl00$groupCheck" type="checkbox" id="mainBody_mainContent_main_newEpisodeForm_NewSnapshot_GroupSelection_groupTypeList_groupList_1_groupCheck_0" isoptionalgroup="true" value="ae37b870-e525-4cce-9315-1e8e4e253483">
<span id="mainBody_mainContent_main_newEpisodeForm_NewSnapshot_GroupSelection_groupTypeList_groupList_1_groupLabel_0">01. First Test</span>
謝謝。
uj5u.com熱心網友回復：
你寧愿使用indexOf()而不是使用contains ();
在 var 中獲取元素$(this)以確保使用正確的元素。
您還可以使用prevAll()（或最接近的（）、nextAll（），具體取決于您的專案）從單擊的元素中獲取元素。再次像這樣，您一定要使用正確的元素來處理。
我在下面評論了我的代碼：
$(".rightColumn .SelectAllGroups").on("click", function () {
// be sure to get select all input
let SelectAllGroups = $(this);
// we check if SelectAllGroups is checked
if ($(SelectAllGroups).is(":checked")) {
// get closest element with class and then find input checkbox inside
$(SelectAllGroups).prevAll(".GroupSelection:first").find("input:checkbox").each(function (i) {
// get checkbox and his val
let SelectionCheckbox = $(this);
let SelectionCheckboxVal = SelectionCheckbox.val();
// check if value contain with indexOf
if (SelectionCheckboxVal.indexOf("01.") != -1 || SelectionCheckboxVal.indexOf("02.") != -1 || SelectionCheckboxVal.indexOf("03 .") != -1 || SelectionCheckboxVal.indexOf("04.") != -1) {
// set prop checked to true
$(SelectionCheckbox).prop('checked', true);
}
});
} else {
$(SelectAllGroups).prevAll(".GroupSelection:first").find("input:checkbox").each(function () {
$(this).prop('checked', false);
});
}
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="rightColumn">
<div class="GroupSelection">
<input type="checkbox" value="01.jqefdqs"> 01.
<input type="checkbox" value="jqefdqs02."> 02.
<input type="checkbox" value="jqef03 .dqs"> 03 .
<input type="checkbox" value="jqef04.dqs"> 04.
<input type="checkbox" value="05.jqefdqs"> 05.
</div>
<input type="checkbox" class="SelectAllGroups"> Select all
</div>uj5u.com熱心網友回復：
因為我有每個復選框的值陣列，而且它們是唯一的，所以我將這些值放在一個陣列中，然后根據陣列中的值設定復選框的 checked 屬性。這是代碼：
$(".rightColumn .SelectAllGroups").on("click", function (evt) {
if (this.checked) {
var initValues = ['ae37b870-e525-4cce-9315-1e8e4e253483',
'89fcfdee-74df-4304-a343-5b7f46accbb2',
'38a2cb37-67a3-44a3-bad3-56bd67dedd2e',
'c5447ffa-f6d2-43bc-9344-07f70fdd1b22',
'33651165-aa95-45f8-9aa1-63472291543e',
'ba49da31-8a5a-4453-8186-e679c73f7329',
'a4ec8b3a-251b-4d8a-865e-8e276811b5ab',
'cf768b29-68cd-453d-97a3-25cb0404298a',
'81d1d54a-1618-4bca-a71b-1314733c7edb',
'160fe561-1963-4b4c-9d61-c0d4a28b4acf',
'28036de1-7fa9-4a90-8093-72f9a1c4400f']
$.each(initValues, function (i, val) {
$("input[value='" val "']").prop('checked', true);
});
} else {
$(".GroupSelection input:checkbox").each(function () {
this.checked = false;
});
}
});
由于這些值是唯一的，因為它們是 GUID，所以這有助于選擇我需要的復選框。
轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/397093.html
上一篇：::jQuery::OnChange更新計時器倒計時
下一篇：滾動影片-影片構建問題