我創建了阻止所有輸入的函式（我使用 for of 回圈完成了它）。現在我想添加條件如果按鈕選中取消阻止，如果未選中阻止。
我寫了以下代碼：
<div class="container">
<input type="number" class="block">
<input type="text" class="block">
<input type="email" class="block">
<input type="checkbox" id="scale1" name="scales">
<label for="scales">Scales</label>
</div>
function blockFileds() {
let inputsForm = document.getElementsByClassName('block');
let checker = document.getElementById('scale1');
for (const singleField of inputsForm) {
if (checker.checked) {
singleField.disabled = false;
} else {
singleField.disabled = true;
}
}
}
blockFileds()
輸入被阻止，但我無法解除阻止。
uj5u.com熱心網友回復：
從函式中洗掉元素，并將 addEventListener 附加到輸入
let inputsForm = document.getElementsByClassName('block');
let checker = document.getElementById('scale1');
function blockFileds() {
for (let singleField of inputsForm) {
if (checker.checked) {
singleField.disabled = false;
} else {
singleField.disabled = true;
}
}
}
blockFileds()
checker.addEventListener("click", (e)=>{
blockFileds()
})
uj5u.com熱心網友回復：
這邊走...
const
inputsForm = document.querySelectorAll('input.block')
, checker = document.querySelector('#scale1')
;
blockFileds()
checker.onclick = blockFileds
function blockFileds()
{
inputsForm.forEach( singleField =>
{
singleField.disabled = !checker.checked
})
}.block, label {
display : block;
margin : .3em 0;
}<div class="container">
<input type="number" class="block">
<input type="text" class="block">
<input type="email" class="block">
<label>
<input type="checkbox" id="scale1" name="scales">
Scales
</label>
</div>uj5u.com熱心網友回復：
你可以試試這個：
const inputsForm = document.getElementsByClassName("block");
const checker = document.getElementById("scale1");
function blockFileds() {
for (let singleField of inputsForm) {
if (!checker.checked) {
singleField.disabled = "";
} else {
singleField.disabled = true;
}
}
}
checker.onclick = () => {
blockFileds();
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/447669.html