首页 > 代码库 > 百度音乐全选
百度音乐全选
<!doctype html><html><head><meta charset="utf-8"><title>无标题文档</title><style>*{ margin:0px; padding:0px; }#wrap{ width:400px; margin:20px auto; border:1px #CCC solid; }#wrap #list li{ height:30px; width:100%; list-style-type:none; position:relative; line-height:30px; }#wrap #list input{ margin-left:10px; } .title{ position:absolute; left:30px; }.singer{ position:absolute; right:35px; }#control{ height:35px; border-top:1px #CCCCCC solid; border-bottom:2px #333333 solid; }#control li{ width:100px; float:left; text-align:left; list-style-type:none; }#control li input{ margin-left:10px; } #control li span{ line-height:35px; margin-left:5px; } #control div{ border:1px #CCC solid; height:20px; width:60px; line-height:20px; padding-left:10px; text-align:center; border-radius:5px; margin:6px 5px; font-size:12px; opacity:0.3; }#favorite{ background:url(img/favorite.gif) no-repeat 5px center; }#add{ background:url(img/add.png) no-repeat 5px center; }#del{ background:url(img/delete.png) no-repeat 5px center; } </style><script type="text/javascript">window.onload = function (){ var oull = document.getElementById(‘list‘); var oli = oull.getElementsByTagName(‘li‘); var oinput = oull.getElementsByTagName(‘input‘); var oulc = document.getElementById(‘control‘); var cdiv = oulc.getElementsByTagName(‘div‘); var cinput = document.getElementById(‘allinput‘); function jishu (a) { for( var i = 0; i < oli.length; i++) { if(oinput[i].checked == true) a++; } return a; }; function hide() { for( var i = 0; i < oli.length; i++) { if( i % 2 == 0 ) { oli[i].style.background = ‘#F7FFFF‘; } else { oli[i].style.background = ‘#fff‘; } oinput[i].checked = false; } for( var i = 0; i < cdiv.length; i++) { cdiv[i].style.opacity = 0.3; } }; function show() { for( var i = 0; i < oli.length; i++) { oli[i].style.background = ‘#EEEEEE‘; oinput[i].checked = true; } for( var i = 0; i < cdiv.length; i++) { cdiv[i].style.opacity = 1; } }; cinput.onclick = function () { if(cinput.checked) { show(); } else { hide(); } }; for( var i = 0; i < oli.length; i++) { oli[i].index = i; oli[i].onclick = function () { if(oinput[this.index].checked ) { this.style.background = ‘#EEEEEE‘; for( var i = 0; i < cdiv.length; i++) { cdiv[i].style.opacity = 1; } if(jishu(0) == 6) { cinput.checked = true; } } else { if( this.index % 2 == 0 ) { this.style.background = ‘#F7FFFF‘; } else { this.style.background = ‘#fff‘; } if(jishu(0) == 0) { for( var i = 0; i < cdiv.length; i++) { cdiv[i].style.opacity = 0.3; } } } }; } };</script></head><body><div id="wrap"> <ul id="list"> <li> <input type="checkbox"> <span class="title">私奔</span> <span class="singer">梁博</span> </li> <li> <input type="checkbox"> <span class="title">北京北京</span> <span class="singer">梁博</span> </li> <li> <input type="checkbox"> <span class="title">我爱你中华</span> <span class="singer">梁博</span> </li> <li> <input type="checkbox"> <span class="title">火花</span> <span class="singer">梁博</span> </li> <li> <input type="checkbox"> <span class="title">回来</span> <span class="singer">梁博</span> </li> <li> <input type="checkbox"> <span class="title">爱要有你才完美</span> <span class="singer">梁博</span> </li> </ul> <ul id="control"> <li> <input id="allinput" type="checkbox"> <span>全选</span> </li> <li> <div class="button" id="favorite">收藏</div> </li> <li> <div class="button" id="add">增加</div> </li> <li> <div class="button" id="del">删除</div> </li> </ul></div></body></html>
百度音乐全选
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。