纯JavaScript 制作多选框逻辑实现
Posted 勇敢*牛牛
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了纯JavaScript 制作多选框逻辑实现相关的知识,希望对你有一定的参考价值。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<form action="#">
<input type="checkbox" id="all">选<br/>
<input type="checkbox"><br/>
<input type="checkbox"><br/>
<input type="checkbox"><br/>
<input type="checkbox"><br/>
<input type="checkbox"><br/>
</form>
<script>
var inputs;
init()
function init()
inputs = [].concat.apply([],document.getElementsByTagName('input'))
console.log(inputs);
for(var i=0;i<inputs.length;i++)
inputs[i].onclick = clickHandler
function clickHandler()
if(this.id == 'all')
for(var i=0;i<inputs.slice(1).length;i++)
inputs[i+1].checked = inputs[0].checked;
// inputs.slice.forEach(function(item)
// item.checked=this.checked;
// console.log('@@@',this);
// ,this)
else
inputs[0].checked = inputs.slice(1).every(function(item)
return item.checked;
)
</script>
</body>
</html>
以上是关于纯JavaScript 制作多选框逻辑实现的主要内容,如果未能解决你的问题,请参考以下文章
javascript中radio框触发事件弹出多个多选框,我修改多选框。点击另外一个radio时保存那些之前勾选的数据