亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

JS全選/反選/取消選擇

原創(chuàng) 2019-01-16 23:34:38 322
摘要:今天看了滅絕老師的課程,通過(guò)老師講的全選,我推測(cè)出了反選和取消選擇,下面是代碼的實(shí)現(xiàn)<!doctype html><html lang="en"><head>    <meta charset="UTF-8">    <title>全選/反選</titl

今天看了滅絕老師的課程,通過(guò)老師講的全選,我推測(cè)出了反選和取消選擇,下面是代碼的實(shí)現(xiàn)

<!doctype html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title>全選/反選</title>
   <style>
.box{
width: 200px;
height: 300px;
border: 2px dashed #8eb9f0;
border-radius: 20px;
padding: 40px 20px;
margin: 50px auto;
       }
li{
height: 40px;
list-style: none;
border-bottom: 2px dashed #8eb9f0;
position: relative;
left: -20px;
line-height: 40px;
       }
button{
padding: 10px auto;
       }
</style>
   <script>
var item = document.getElementsByName('item[]'); //獲取選項(xiàng)框
function checkAll() {
for (var i = 0; i < item.length; i++) {
if (true){
item[i].checked = true;
               }
           }
       }
function cancel() {
for (var i = 0; i < item.length; i++) {
if (true) {
item[i].checked = false;
               }
           }
       }
function selectInvert() {
for (var i = 0; i < item.length; i++) {
if (true) {
if (item[i].checked) {
item[i].checked = false;
                   } else {
item[i].checked = true;
                   }
               }
           }
       }
</script>
</head>
<body>
<div class="box">
   <ul>
       <li><input type="checkbox" name="item[]"><label>選項(xiàng)1</label><br></li>
       <li><input type="checkbox" name="item[]"><label>選項(xiàng)2</label><br></li>
       <li><input type="checkbox" name="item[]"><label>選項(xiàng)3</label><br></li>
       <li><input type="checkbox" name="item[]"><label>選項(xiàng)4</label><br></li>
       <li><input type="checkbox" name="item[]"><label>選項(xiàng)5</label><br></li>
   </ul>
   <button onclick="checkAll()" id="checkall">全選</button>
   <button onclick="selectInvert()">反選</button>
   <button onclick="cancel()">取消選擇</button>
</div>
</body>
</html>

演示地址 -> http://47.107.64.136/JS/5/

批改老師:天蓬老師批改時(shí)間:2019-01-17 09:07:16
老師總結(jié):checkbox中的每個(gè)name必須一致, 才能編成一組, 它和radio不一樣, 他是一個(gè)多選項(xiàng),會(huì)返回這個(gè)組中的多個(gè)有checked屬性的值,這個(gè)要注意

發(fā)佈手記

熱門詞條