如果填写了其中一个文本框，则启用提交按钮

Question

这不能正常工作.. 因为当我们在一个文本字段中输入并再次将其设置为空时，提交按钮将被禁用..

我需要提交按钮才能在我的某个文本字段有价值时才能使用。

的test.html

        <form action=''>
            Location :<input name="location" id="keyword" type='text' /><br>
            Category :<input name="category" id="cat_keyword" type='text'><br>
            <input type="submit" id="loccat" class="send" value="Search">
        </form>

jquery的

$(document).ready(function(){
    if ($('#keyword').val() == '' && $('#cat_keyword').val() == '') {
        $('#loccat').attr('disabled','disabled');
    }
    else{
        $('#loccat').removeAttr('disabled');
    }

    //For location textfield
    $("#keyword").keyup(function(){
         if ($('#keyword').val() != '') {
            $('#loccat').removeAttr('disabled');
         }
         else{
                 $('#loccat').attr('disabled','disabled');
         }
     });                               

     //For category textfield
     $("#cat_keyword").keyup(function(){
         if ($('#cat_keyword').val() != '') {
             $('#loccat').removeAttr('disabled');
         }
         else{
             $('#loccat').attr('disabled','disabled');
         }
     });
});

Answer 1

在两个keyup事件中，检查两个文本字段值。在两个事件中添加波纹管代码。

 If($("cat_keyword").Val() != "" || $("keysod").Val() != "") {
     // enable button
 } else {
      // disable button
 }

Answer 2

您可能希望为文本框分配一个类，然后使用以下过程：

• 确定填充的文本框数
• 如果该数字为零，则禁用submit按钮
• 否则启用submit按钮
• 将此代码附加到input事件
• 在页面加载时触发input事件
• 您可以将文本框的数量增加到您想要的任何数字，相同的代码仍可以使用。

以下是代码：

$(document).ready(function() {
    $('.formfield').on('input', function() {
        var nFilled = $('.formfield').filter(function() {
            return $.trim( this.value ) !== '';
        }).length;
        $('#loccat').prop('disabled', nFilled === 0);
    })
    .trigger('input');
});

现在演示：

＆＃13;

＆＃13;

$(document).ready(function() {
    $('.formfield').on('input', function() {
        var nFilled = $('.formfield').filter(function() {
            return $.trim( this.value ) !== '';
        }).length;
        $('#loccat').prop('disabled', nFilled === 0);
    })
    .trigger('input');
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<form action=''>
  Location :
  <input name="location" id="keyword" type='text' class="formfield" />
  <br>Category :
  <input name="category" id="cat_keyword" type='text' class="formfield" >
  <br>
  <input type="submit" id="loccat" class="send" value="Search">
</form>

＆＃13;

＆＃13;

＆＃13;

Answer 3

而不是其他，如果条件检查其他字段是否也为空，则提供其他

 $("#keyword").keyup(function(){
                                if ($('#keyword').val() != '') {
                                $('#loccat').removeAttr('disabled');
                                }
                                else  if ($('#cat_keyword').val() == ''){
                                $('#loccat').attr('disabled','disabled');
                                }
                            });


                    //For category textfield
                    $("#cat_keyword").keyup(function(){
                                if ($('#cat_keyword').val() != '') {
                                $('#loccat').removeAttr('disabled');
                                }
                                else  if ($('#keyword').val() == ''){
                                $('#loccat').attr('disabled','disabled');
                                }
                            });

Answer 4

尝试使用keypress（）事件，每次更改文本框的值时都会启动它

http://api.jquery.com/keypress/

Answer 5

试试这个。

HTML中的

    <form action=''>
    Location :<input name="location" id="keyword" type='text' onchange="watchInput()" /><br>
    Category :<input name="category" id="cat_keyword" type='text' onchange="watchInput()"><br>
    <input type="submit" id="loccat" class="send" value="Search">
    </form>

和JS

var watchInput = function() {
   if ($('#cat_keyword').val() || $('#keyword').val()) {
      $('#loccat').removeAttr('disabled');
   } else {
      $('#loccat').attr('disabled', 'disabled');
   }
};

Answer 6

默认情况下在html中将提交按钮设置为禁用，无需在JS中执行。

<form id="myform" action=''>
Location :<input name="location" id="keyword" type='text' /><br>
Category :<input name="category" id="cat_keyword" type='text'><br>
<input type="submit" id="loccat" class="send" value="Search" disabled>
</form>

$(document).ready(function(){
$("#myform input").keyup(function(){
$("#myform input").each(function(){
if ($(this).val() != '') {
$('#loccat').removeAttr('disabled');
}
else{
 $('#loccat').attr('disabled','disabled');
}
});
});                               
});

Answer 7

<强>的test.html

<form action=''>
        Location :<input name="location" id="keyword" type='text' /><br>
        Category :<input name="category" id="cat_keyword" type='text'><br>
        <input type="submit" id="loccat" class="send" value="Search" disabled>
</form>

<强> Jquery的

  $(document).ready(function(){

            var text1 =  $("#keyword").val();
            var text2 =  $("#cat_keyword").val();

            if(text1.length == 0 && text2.length == 0  ){
            $("#loccat").attr("disabled","disabled");
            }

            $("#keyword").keyup(function(){
                   var text1 =  $("#keyword").val();
                   var text2 =  $("#cat_keyword").val();
              if(text1.length == 0 && text2.length == 0  ){
                           $("#loccat").attr("disabled","disabled");
                   }else{
                           $("#loccat").removeAttr("disabled");
                   }
            });

            $("#cat_keyword").keyup(function(){
                   var text1 =  $("#keyword").val();
                   var text2 =  $("#cat_keyword").val();
              if(text1.length == 0 && text2.length == 0  ){
                           $("#loccat").attr("disabled","disabled");
                   }else{
                           $("#loccat").removeAttr("disabled");
                   }
            });

  });

一个简单的解决方案......为我工作..