如何在html5中通過javascript啓用按鈕？

Question

我試圖在JavaScript中啓用一個按鈕，只要用戶輸入文本。 這段代碼有什麼問題？是因爲使用了fieldset嗎？

function setText() { 
 
    var x = document.getElementById("mail").value; 
 
    if (x != "") { 
 
    document.getElementById("btn").disabled = 'false'; 
 
    } 
 
}

<form> 
 
    <fieldset id="file1"> 
 
    <legend><img src="fb-login.png" height="70" width="70" /> :</legend> 
 

 
    Email: <input id="mail" type="email" onchange="setText()"><br> password: <input type="password"><br><br> 
 
    <input type="submit" id="btn" value="ok" disabled> <br> 
 
    </fieldset> 
 
</form>

Answer 1

下面是正確的方法，而不是使用平變化，你應該使用oninput /的onkeyup：

function setText(){ 
 
    var x=document.getElementById("mail").value.trim(); 
 
    if(x !=""){ 
 
    document.getElementById("btn").disabled = false; 
 
     } 
 
    else{ 
 
    document.getElementById("btn").disabled = true; 
 
     } 
 
    }

<form> 
 
    <fieldset id="file1"> 
 
    <legend><img src="fb-login.png" height="70" width="70"/> :</legend> 
 

 
     Email: <input id="mail" type="email" onkeyup="setText()"><br> 
 
     password: <input type="password"><br><br> 
 
    <input type="submit" id="btn" value="ok" disabled> <br> 
 
    </fieldset> 
 
</form>

UPDATE

較短的方法由下面@mplungjan給出：

function setText() { 
    document.getElementById("btn").disabled = document.getElementById("mail").value.trim()==""; 
} 

Answer 2

首先，使用oninput事件而不是onchange結合打字事件。然後，false是JavaScript中的布爾關鍵字，而不是字符串。這是一個工作示例：

function setText() { 
 
    var x = document.getElementById("mail").value.trim(); 
 
    document.getElementById("btn").disabled = x == ""; 
 
}

<form> 
 
    <fieldset id="file1"> 
 
    <legend><img src="fb-login.png" height="70" width="70" /> :</legend> 
 

 
    Email: 
 
    <input id="mail" type="email" oninput="setText()"> 
 
    <br> password: 
 
    <input type="password"> 
 
    <br> 
 
    <br> 
 
    <input type="submit" id="btn" value="ok" disabled> 
 
    <br> 
 
    </fieldset> 
 
</form>