描述:进行多选框的练习,进行全选,全不选,反选,点击发送时打印出所选的信息。具体页面如下
实现:
1.进行全选,全选的同时,最上面的全选全不选也要选上,即代码中的checkallBox,代码如下:
2.全不选,最上面的全选全不选的checked要为false,代码如下:
3.反选(遍历所有checkbox,将他们的checked值取反),如果之前是全选或全不选状态时,进行反选时也要对最上面的全选全不选状态进行判断,代码如下:
4.点击发送按钮时,弹出所选框的值,代码如下:
5.当点击最上面的全选全不选选框时,进行下面选框的全选或全不选,代码如下:
6.当选中四个框或取消四个框时,全选/全不选也自动选上或取消(给每个框绑定一个函数,检测是否都选上了,都选上则设为true)代码如下:
多选框练习--js实现
最新推荐文章于 2023-08-09 08:22:21 发布