如何在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>