文本框为空时 onkeyup 不起作用

Question

我旁边有一个文本框和一个提交按钮。该按钮处于禁用状态。一旦用户在文本框中键入内容，就应该启用它。那工作正常。但是一旦用户开始输入，它就会被启用。如果使用退格键将字段清空，按钮仍保持启用状态。

<html>
<body> 
  <input type="text" id="fname" onkeyup="myFunction()"> 
  <input type="button" id="a" disabled = "true" value ="click me"> 
  <script> 
    function myFunction() 
    { 
      var x = document.getElementById("fname"); 
      x.value = x.value.toUpperCase(); 
      if(x.value != " ") 
      { 
        document.getElementById('a').disabled=false; 
      } 
    } 
  </script> 
</body> 
</html>

Answer 1

你们很亲近。您所要做的就是检查长度属性并添加一个 else 语句以在文本框中没有值时禁用该按钮。

<html>
<body>
<input type="text" id="fname" onkeyup="myFunction()">
<input type="button" id="a" disabled = "true" value ="click me">

<script>
function myFunction() {
    var x = document.getElementById("fname");
    x.value = x.value.toUpperCase();
if(x.value.length > 0)
{
   document.getElementById('a').disabled=false;
}
else
{
  document.getElementById('a').disabled=true;
}
}
</script>
</body>
</html>

Answer 2

我建议您在 HTML

中使用此代码

<input type="submit" id="register" value="Register" disabled="disabled" />

并在 javascript

中进行以下更改

(function() {
$('form > input').keyup(function() {

    var empty = false;
    $('form > input').each(function() {
        if ($(this).val() == '') {
            empty = true;
        }
    });

    if (empty) {
        $('#register').attr('disabled', 'disabled'); // updated according to 
    } else {
        $('#register').removeAttr('disabled'); // updated according to 
    }
});

我认为它确实有效well.Hope你得到了你想要的操作。谢谢。

Answer 3

您需要分别编写 if else 条件才能起作用，Demo，并尽量避免将事件侦听器直接添加到标记中:)

$('#fname').keyup(function() {
  //console.log('wor');  
    if(!$(this).val() == '') {
        $('#a').prop("disabled", false);
    }
    else{
        $('#a').prop("disabled", true);
    }
})

Answer 4

您应该在您的条件中添加 else 语句，以便在文本框为空时禁用该按钮。试试下面的代码。

<html>
<body>
<input type="text" id="fname" onkeyup="myFunction()">
<input type="button" id="a" disabled = "true" value ="click me">

<script>
function myFunction() {

    var x = document.getElementById("fname");
    x.value = x.value.toUpperCase();
    if(x.value != "")
{
   document.getElementById('a').disabled=false;
}else {
document.getElementById('a').disabled=true;
}
}
</script>
</body>
</html>

Answer 5

如下所示更新您的脚本

   function myFunction() {
        var x = document.getElementById("fname");
        x.value = x.value.toUpperCase();
        if (x.value.length != 0) {--here is the change
            document.getElementById('a').disabled = false;
        }
        else {
            alert('Empty');
            document.getElementById('a').disabled = true;
        }
    }

文本框为空时 onkeyup 不起作用

onkeyup not working when text box is empty

javascript

onkeyup