修改js代码利用JQuery
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>限制选择课程的个数</title>
<script type="text/javascript">
window.onload = function(){//页面所有元素加载完毕
var btn = document.getElementById("btn"); //获取id为btn的元素(button)
btn.onclick = function(){ //给元素添加onclick事件
var arrays = new Array(); //创建一个数组对象，把选中的对象添加到数组中
var items = document.getElementsByName("check"); //获取name为check的一组元素(checkbox)
for(var i=0; i < items.length; i++){ //循环这组数据
if(items[i].checked){ //判断是否选中
arrays.push(items[i].value); //把符合条件的 添加到数组中. push()向数组末尾添加数据
}
}
if(arrays.length>6){//判断选中课程的个数
alert("您最多可以选择6门课程")
}
}
}
</script>
</head>
<body>
<form method="post" action="#">
<input type="checkbox"name="check"value="1">C语言<br>
<input type="checkbox"name="check"value="2">机械制图<br>
<input type="checkbox"name="check"value="3">单片机<br>
<input type="checkbox"name="check"value="4">自动控制<br>
<input type="checkbox"name="check"value="5">传感器<br>
<input type="checkbox"name="check"value="6">高等数学<br>
<input type="checkbox"name="check"value="7">计算机基础<br>
<input type="checkbox"name="check"value="8">Oracle数据库<br>
<input type="checkbox"name="check"value="9">商务英语<br>
<input type="checkbox"name="check"value="10">PLC设计基础<br>
<input type="submit" value="提交" id="btn"/>
</form>
</body>
</html>
