天天看點

(day03-1)四大狀态屬性(enabled disabled selected checked):disabled 比如點選同意了才能注冊使用者..

<!DOCTYPE html>
<html >
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
<input type="checkbox">同意<br>
<input type="button" value="注冊新使用者" disabled>

<script>
    **//1、查找 觸發事件的元素**
    var chb=document.querySelector("input[type=checkbox]");//選擇器查找
    **//2、綁定 事件處理函數**
    chb.onclick=function(){
        var chb=this;//指定目前的選中的
        **//3、查找要修改的元素**
        var btn=chb.nextElementSibling
                   .nextElementSibling;
                   //有個br搗亂。現在站在checkbox位置,要找到修改元素button
        **//4、修改元素**
        //若chb(同意)狀态是選中,btn就啟用,false
        if(chb.checked==true){
            btn.disabled=false;
        }else{//否則
            btn.disabled=true;//btn就禁用
        }//disabled是html樣式,與css無關。btn.style.disabled=true;寫法是錯的
    }
       
</script>
</body>
</html>

           
(day03-1)四大狀态屬性(enabled disabled selected checked):disabled 比如點選同意了才能注冊使用者..
(day03-1)四大狀态屬性(enabled disabled selected checked):disabled 比如點選同意了才能注冊使用者..