轻松修改jQuery代码以使用多个文本框

Question

如何更改以下代码以使用ID为extra1，extra2，persons和table的所有4个文本框？

$(document).ready(function () {
  $('#extra1').blur(function () {
        if ($.trim(this.value) == "") {
          $('#btnUpdate').attr("disabled", true);
        }
      else {
            $('#btnUpdate').removeAttr("disabled");
      }
    });
});

Answer 1

  $('#extra1').blur(function () {

至

  $('#extra1, #extra2, #persons, #tables').blur(function () {

Answer 2

代码修改为：

$(document).ready(function () {
  $('#extra1, #extra2, #persons, #tables').blur(function () {
        if ($.trim(this.value) == "") {
          $('#btnUpdate').attr("disabled", true);
        }
      else {
            $('#btnUpdate').removeAttr("disabled");
      }
    });
});

但是，为什么不给它们所有人一个类，然后将该类用作选择器呢？ 这样，您以后就可以轻松添加元素，而无需更改Javascript。

Answer 3

使用jQuery 委托 ，它将仅绑定一个事件处理程序，但仅对触发event的元素起作用。 尝试这个

唤醒演示

$(document).ready(function () {
  $('formSelector').delegate('input[type=text]', 'blur', function () {
      if ($.trim(this.value) == "") {
          $('#btnUpdate').attr("disabled", true);
      }
      else {
            $('#btnUpdate').removeAttr("disabled");
      }
    });
});