js实现多选框的全选
<form action="" method="post">
<input type="checkbox" id="first" /><br>
<input type="checkbox" name="aihao" value="唱歌" />唱歌 <br>
<input type="checkbox" name="aihao" value="跳舞" />跳舞 <br>
<input type="checkbox" name="aihao" value="睡觉" />睡觉 <br>
<input type="button" id="submit" value="提交" />
</form>
<script type="text/javascript">
var first = document.getElementById('first');
var aihaos = document.getElementsByName('aihao');
first.onclick = function() {
for (var i = 0; i < aihaos.length; i++) {
aihaos[i].checked = first.checked;
}
}
//当都被选中时,复选框也被选中
var all = aihaos.length;
for (var i = 0; i < aihaos.length; i++) {
console.log('for循环')
aihaos[i].onclick = function() {
var count = 0;
for (var j = 0; j < aihaos.length; j++) {
console.log('j='+j);
if (aihaos[j].checked) {
count++;
}
}
console.log(count);
first.checked = (all == count);
}
}
//提交value值,为一个String数组
var submit = document.getElementById('submit');
submit.onclick = function () {
var arr = [];
for (var i = 0; i < aihaos.length; i++) {
if (aihaos[i].checked) {
arr.push(aihaos[i].value)
}
}
console.log(arr);
}
</script>