Canonical jQuery方法动态启用/禁用表单提交按钮

时间:2010-08-30 17:34:30

标签: javascript jquery

我正在编写一些JavaScript来处理在关联文本字段中输入某些文本时动态启用表单提交按钮的常见方案。我多年来一直在使用Prototype框架,但我正在转向jQuery。所以我惊讶地发现我的代码的jQuery版本看起来很笨重。

有没有办法避免在下面的jQuery代码中引用第0个数组元素,或者更常规的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>

1 个答案:

答案 0 :(得分:4)

在jQuery中,使用attr方法在元素上设置属性。通过获取jQuery集中的第一个项[0],您将直接操作本机DOM元素的disabled属性 - 这不是jQuery。

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

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