时间:2021-05-26
本文实例为大家分享了js全选操作的具体代码,供大家参考,具体内容如下
<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><style>*{margin:0;padding:0;}ul{list-style:none;}#content{width:300px;border:1px solid #ccc;margin:20px auto;}#content ul{width:300px;}#content ul li,#content div{width:300px;height:50px;line-height:50px;border-bottom:1px dotted #ccc;text-indent:20px;}#content ul li:nth-child(odd) {background:#f1f1f1;}#content ul li.active,#content ul li:hover{background:#99FFCC;}</style><script>window.onload = function () { var oDiv = document.getElementById('content'); var checkAll = document.getElementById('checkAll'); var aLi = oDiv.getElementsByTagName('li'); var aInput = oDiv.getElementsByTagName('input'); for ( var i = 0; i < aInput.length; i++ ) { aInput[i].index = i; aInput[i].onclick = function () { aLi[this.index].className = this.checked ? 'active' : ''; } } checkAll.onclick = function () { for ( var i = 0; i < aInput.length; i++ ) { if(!aInput[i].checked) aInput[i].checked = true; aLi[i].className = 'active'; } }}</script></head><body><div id="content"> <ul> <li> <input type="checkbox"/> <span>私奔</span> <span>梁博</span> </li> <li> <input type="checkbox"/> <span>北京</span> <span>杜甫</span> </li> <li> <input type="checkbox"/> <span>花人</span> <span>李白</span> </li> <li> <input type="checkbox"/> <span>神话</span> <span>光良</span> </li> <li> <input type="checkbox"/> <span>神话</span> <span>光良</span> </li> <li> <input type="checkbox"/> <span>神话</span> <span>光良</span> </li> <li> <input type="checkbox"/> <span>神话</span> <span>光良</span> </li> <li> <input type="checkbox"/> <span>神话</span> <span>光良</span> </li> <li> <input type="checkbox"/> <span>神话</span> <span>光良</span> </li> </ul> <div> <input id="checkAll" type="checkbox" />全选 </div></div></body></html>以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
本文实例讲述了js实现仿百度瀑布流的方法。分享给大家供大家参考。具体实现方法如下:仿百度图片瀑布流*{margin:0;padding:0;}#containe
本文实例讲述了JS实现仿google、百度搜索框输入信息智能提示的实现方法。分享给大家供大家参考。具体如下:仿google、百度搜索框输入信息智能提示的实现bo
早前的千千静听正式更名为百度音乐。在百度音乐上拥有强大的资源、高品质。百度音乐盒是百度音乐的客户端软件,有时会遇到打不开百度音乐盒,那么该怎么办?软件名称:
百度音乐链接在哪里?怎么找?小编带来了百度音乐mp3链接地址复制方法,很多朋友想要复制百度音乐歌曲的mp3链接,可是却找不到,请参考下文步骤操作吧。 第一
百度音乐链接在哪里?怎么找?小编带来了百度音乐mp3链接地址复制方法,很多朋友想要复制百度音乐歌曲的mp3链接,可是却找不到,请参考下文步骤操作吧。软件名称