Question

我的提交按钮被禁用，但不会再回到启用状态。怎么了？

HTML：

<div class="wrapper">
    <form method="post" action="timer.html">
        <p><input type="text" name="login" value="" placeholder="Username" id='userNameCheck' onkeyup="checkUserName()"></p>
        <p class="submit"><input type="submit" name="submit" value="Login" id="mySubmit"></p>
     </form>
</div>

JS：

<script>
    document.getElementById("mySubmit").disabled = true;
    function checkUserName() {
        var userNames = document.getElementById("userNameCheck");
        if(userNames === 'andrius'){
            document.getElementById("mySubmit").disabled = false;
        }
    }
</script>

Answer 1

您的代码存在一些问题

<input type="text" name="login" value="" placeholder="Username"  id='userNameCheck' onkeyup="checkUserName()" disabled= "disabled">

你的js代码看起来应该是这样的

function checkUserName() {
    var userNames = document.getElementById("userNameCheck").value;
    alert(userNames);
    if(userNames === 'andrius'){
        alert("true");
        document.getElementById("mySubmit").disabled = false;
    }
}

您的错误是您没有获得用户名字段值。它作为html对象返回。这段代码适用于你。

Answer 2

你有很多错误，错误1：您试图在DOM加载网页上的按钮之前禁用该按钮，这将引发错误。

document.getElementById("mySubmit").disabled = true;

这必须保存在一个名为onload的函数中。

错误2：

 var userNames = document.getElementById("userNameCheck");

上面的行不会将值传递给变量

完整的工作方案：复制粘贴：

 <script type="text/javascript">
 function onLoad()
 {
  document.getElementById("mySubmit").disabled = true;
 }
 function checkUserName() {
         var userNames = document.getElementById("userNameCheck").value;
         if(userNames === 'andrius'){
             document.getElementById("mySubmit").disabled = false;
         }
     }
    </script>

Answer 3

我已将disabled属性添加到您的提交按钮。 disabled="disabled"我还在您的userNames变量中添加了value属性，以比较if语句中的值。根据我的评论中的建议，如果输入从andrius更改，我已将else添加到if语句中以禁用该按钮。如果用户键入andrius然后将其删除，则不会禁用提交按钮，因为if语句已启用它。

＆＃13;

    function checkUserName() {
        var userNames = document.getElementById("userNameCheck");
        var SubBtn=document.getElementById("mySubmit");
        if(userNames.value === 'andrius'){
            SubBtn.disabled=false;
        }else{
        	SubBtn.disabled=true;
        }
    }

＆＃13;

<div class="wrapper">
    <form method="post" action="timer.html">
        <p><input type="text" name="login" value="" placeholder="Username" id='userNameCheck' onkeyup="checkUserName()"/></p>
        <p class="submit"><input type="submit" name="submit" value="Login" id="mySubmit" disabled="disabled"/></p>
     </form>
</div>

＆＃13;

如果您有任何疑问，请发表评论，我会尽快回复您。

我希望这会有所帮助。快乐的编码！

Answer 4

我发现了自己的问题，但是谢谢大家的信息。问题是：我忘了把.value l

密钥上的JavaScript提交启用

4 个答案: