javascript - 动态启用/禁用表单提交按钮的规范 jQuery 方法

Question

我正在编写一些 JavaScript 来处理在相关文本字段中输入某些文本时动态启用表单提交按钮的常见情况。多年来我一直在使用 Prototype 框架，但现在正在转向 jQuery。所以我惊讶地发现我的代码的 jQuery 版本似乎有点笨拙。

有没有一种方法可以避免在下面的 jQuery 代码中引用第零个数组元素，或者一般来说更规范的 jQuery 方法？

<form action="...">
  <input id="subject" type="text" />
  <input id="save" type="submit" value="Save" disabled="disabled" />
</form>
<script type="text/javascript">

  // Prototype version
  $("subject").observe("keyup", function() {
    $("save").disabled = $("subject").value.length == 0;
  });

  // jQuery version
  $("#subject").keyup(function() {
    $("#save")[0].disabled = $("#name")[0].value.length == 0;
  });
</script>

Answer 1

在 jQuery 中，使用 attr 方法为元素设置属性。通过获取 jQuery 集中的第一项 [0]，您可以直接操作 native DOM 元素的 disabled 属性——这不是 jQuery。

$("#save").attr('disabled', true);

$("#subject").keyup(function() {
    $("#save").attr('disabled', $("#name").val().length == 0);
});