首頁猿問給定復選框的值，禁用/隱藏復選框列...

給定復選框的值，禁用/隱藏復選框列表中的復選框（純 JS）

JavaScript

繁花如伊 2022-11-03 09:59:23

我正在嘗試禁用或隱藏復選框列表中的某些復選框，給定允許選擇的最大復選框數。即如果復選框的值大于 my_value 則復選框被禁用/隱藏并且不能被選中......并將其工作到此代碼中：<div class="container"> <table class="table"> <thead> <tr> <th align="left">Max Number of Checks</th> </tr> </thead> <tbody> <tr> <td> <input id="Check_01" name="FW_check" value="1" type="checkbox" /> <input id="Check_02" name="FW_check" value="2" type="checkbox" /> <input id="Check_03" name="FW_check" value="3" type="checkbox" /> <input id="Check_04" name="FW_check" value="4" type="checkbox" /> <input id="Check_05" name="FW_check" value="5" type="checkbox" /> </td> </tr> <tr> <td> <input id="Check_06" name="FW_check" value="6" type="checkbox" /> <input id="Check_07" name="FW_check" value="7" type="checkbox" /> <input id="Check_08" name="FW_check" value="8" type="checkbox" /> <input id="Check_09" name="FW_check" value="9" type="checkbox" /> <input id="Check_10" name="FW_check" value="10" type="checkbox" /> </td> </tr> </tbody> </table></div>

查看完整描述

2 回答

開心每一天1111

TA貢獻1836條經驗獲得超13個贊

我假設以下內容：

my_value（復選框的最大值）設置在此代碼之外的某處
表中具有 name 屬性的所有復選框FW_check看起來像您在上面發布的輸入元素（主要意味著它們value是有效數字）

也就是說，我建議您執行以下操作：

獲取表中每個input[name="FW_check"]的列表，使用document.querySelector
遍歷這些復選框，檢查value輸入，并設置disabled = true該值是否大于最大值。

這是一些可以完成此操作的基本代碼：

const my_value = // some number that you have defined elsewhere, as mentioned above

const checkboxes = document.querySelector('.table input[name="FW_check"]');

for (const checkbox of checkboxes) {

const value = Number.parseInt(checkbox.value, 10); // note the base 10. in case you accidentally put a 0 before a number, it still parses correctly and doesn't assume base 8

checkbox.disabled = value > my_value; // this will handle re-enabling the checkbox if this function is run again after my_value drops

}

這當然可以根據需要運行多次，放入函數等。

反對回復 2022-11-03

慕斯王

TA貢獻1864條經驗獲得超2個贊

如果我正確理解你的問題，這就是你要找的。

var max = 5;

var checkboxes = document.getElementsByName("FW_check");

for(var i=0;i<checkboxes.length;i++){

if(i<max){

checkboxes[i].disabled = false;

} else {

checkboxes[i].disabled = true;

}

<thead>

<tr>

<th align="left">Max Number of Checks</th>

</tr>

</thead>

<tbody>

<tr>

<td>

</td>

</tr>

<tr>

<td>

</td>

</tr>

</tbody>

</table>

</div>

反對回復 2022-11-03

2 回答
0 關注
183 瀏覽

關注

添加回答

舉報

0/150

提交

取消

亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

熱搜

最近搜索清空

給定復選框的值，禁用/隱藏復選框列表中的復選框（純 JS）

給定復選框的值，禁用/隱藏復選框列表中的復選框（純 JS）

2 回答

添加回答

給定復選框的值，禁用/隱藏復選框列表中的復選框（純 JS）