gpt4 book ai didi

javascript - 如何制作 'checked' 复选框,无法取消选中

转载 作者:行者123 更新时间:2023-11-30 14:43:49 26 4
gpt4 key购买 nike

基本上,我使用纯 JS 创建一个复选框范围。我想不通的是,如何使选中的范围无法取消选中。例如,您选中 25。所以数字 34 应该是不可能取消选中的,但是 25 是可以取消选中的。

<ul>
<li><input type="checkbox" value="1">One</input></li>
<li><input type="checkbox" value="2">Two</input></li>
<li><input type="checkbox" value="3">Three</input></li>
<li><input type="checkbox" value="4">Four</input></li>
<li><input type="checkbox" value="5">Five</input></li>
<li><input type="checkbox" value="6">Six</input></li>
<li><input type="checkbox" value="7">Seven</input></li>
</ul>


// JavaScript
var el = document.getElementsByTagName("input");
var lastChecked = null;

// Iterate through every 'input' element and add an event listener = click
for(var i = 0; i < el.length; i++){
el[i].addEventListener("click", myFunction);
}

function myFunction() {
// In this statement we check, which input is checked..✓
if (!lastChecked) {
lastChecked = this;
return;
}

// Declaring 'from' and 'to' and getting index number of an array-like inputs
var from = [].indexOf.call(el, this);
var to = [].indexOf.call(el, lastChecked);

/* Here we will know which 'check' will be the min and which will be the max with the
help of Math metods */
var start = Math.min(from, to);
var end = Math.max(from, to) + 1;

// Here we create an array from NodeList
var arr = Array.prototype.slice.call(el);

// Here we get a new array, where we declare the start and the end
// Start is the min, end is the max
var slicedArr = arr.slice(start, end);

// Now we iterate through every sliced input, and set its attribute to checked
for(var j = 0; j < slicedArr.length; j++){
slicedArr[j].checked = lastChecked.checked;
}

lastChecked = this;

}

谢谢大家的帮助。顺便说一句,这是我关于 stackoverflow 的第一篇文章,所以如果我没有正确发布它,我很抱歉。谢谢。

最佳答案

让复选框不可选中是不可能的。

当然,你可以使用

document.getElementById("elemnt-id").disabled = true;

或通过

html 中的

disabled 属性,

但总有一种方法可以通过开发人员工具手动取消选中它们。所以你也应该在服务器上进行一些验证。

关于javascript - 如何制作 'checked' 复选框,无法取消选中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49274940/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com