JQuery如果某些textboxe为空，则禁用按钮

Question

我见过很多人禁用按钮的例子，如果文本框是空的但是我没有找到任何会禁用某些文本框的按钮的例子。我是Jquery的新手，我知道它是伪编码的，但你可以得到这个想法。我必须调用哪个Jquery函数才能不断检查？如何在if子句中使用or语句来确定是否有任何文本框字段为空？

if( $('#txtEvent').val.length === 0 || $("#txtID").val.length === 0)
 {
  $('#btnSave').attr("disabled", "disabled");
 }
else 
 {
  $('#btnSave').attr("enabled", "enabled");
 }

表单控件

 <asp:TextBox ID="txtEvent" runat="server"></asp:TextBox>
< asp:TextBox ID="txtID" runat="server"></asp:TextBox>
<asp:Button ID="btnSave" runat="server"" Text="Save and Next" />

Answer 1

您可以采用两种不同的方式：

if (!$("#txtEvent").val()) { //undefined will yield false
//call a method! .val() not .val
    $("#btnSave").attr("disabled", "disabled");
} else {
    $("#btnSave").attr("enabled", "enabled");
}

或者：

if ($("#txtEvent").length > 0) {
    $("#btnSave").attr("disabled", "disabled");
} else {
    $("#btnSave").attr("enabled", "enabled");
}

如果你想让它们不断运行，请将它们包装成：

$("#txtEvent").on("change", function() { //code });
//using the onchange event will trigger the code whenever the txtbox changes.
//you can also use onblur if you want it to trigger AFTER the txtbox loses focus

请注意，您必须将这些转换为适当的asp代码！这只是一个后勤问题。

Answer 2

尝试

var $empties = $('#txtEvent, #txtID').filter(function(){
    return $.trim($(this).val()).length == 0
})

$('#btnSave').prop("disabled", $empties.length === 0);

Answer 3

即使这是两年前的问题，我想用bind来表示另一种方式。请参阅文字'keyup mouseup cut paste'

如果您 剪切 或 粘贴 文本以及键盘输入，这也会有效。如果我们单击文本框中的小十字以清除文本（使用mouseup），这也将起作用。

OP声明禁用了某些文本框＆＃34;的按钮。 假设我们有以下文本框

<input type="text" name="tbox1" id="txtbox1" />
<input type="text" name="tbox2" id="txtbox2" />
<input type="text" name="tbox3" id="txtbox3" />
<input type="text" name="tbox4" id="txtbox4" />
<input type="submit" id="btnSubmit" name="button" value="Save and Next" disabled />

如果我们需要根据输入到txtBox1或txtBox3的值启用/禁用按钮，那么我们可以使用此

<script>
  $(document).ready(function() {

      $("#txtbox1, #txtbox3").bind('keyup mouseup cut paste', function () {
          var txt = $(this);
          setTimeout(function () {
              $('#btnSubmit').prop('disabled', $(txt).val() == ''); 
           }, 100);
      });
  });
</script>

如果我们只在txtBox1和txtBox3都不为空时才需要启用/禁用按钮，那么我们可以使用这个

<script>
  $(document).ready(function() {
      $("#txtbox1, #txtbox3").bind('keyup mouseup cut paste', function () {
         setTimeout(function () {
             ($('#txtbox1').val() && $('#txtbox3').val()) ? $('#btnSubmit').prop('disabled', false) : $('#btnSubmit').prop('disabled', true);
         }, 100);
      });
  });
</script>