直到表单填写完毕，才启用提交按钮（灰色禁用）。

Question

我有一个表单：

 <form action="http://www.tahara.es/contact/subscribe.php" method="post" id="subscribe" name="subscribe">
      <input type="hidden" name="action" value="subscribe">
      <label>NAME:</label>
      <input type="text" name="name" class="Textbox" id="sub_first_name">
      <label>EMAIL:</label>
      <input type="text" name="email" class="Textbox" id="sub_email">
      <input type="submit" name="button" id="button" value="Subscribe" />

我希望在表单中的两个字段均被填写之前，将submit按钮置为灰色。我猜想jquery可以解决这个问题？

我应该如何实现这个功能，并将脚本放在哪里？

- samyb8

---

$('#button').prop('disabled', boolean 所有字段都已填写？) ... 您可以在输入字段的 keyup.. blur.. change.. 上进行检查和更改。 - wirey00

Answer 1

Jquery可以做到这一点。在.keyup事件中，让jquery检查两个字段的长度是否都大于0，并更改按钮以启用或禁用。

$('#yourButton').button("disable");​​​​​​​​​​​​​

$('.fields').bind('keyup', function() { 
var nameLength = $("#sub_first_name").length;
var emailLength = $("#sub_email").length;

if (nameLength > 0 && emailLength > 0)
{
   $('#yourButton').button("enable");​​​​​​​​​​​​​
}

} );

- Mr. Wise

Answer 2

如果你是JavaScript的初学者，更好的选择是：

按照以下方式添加HTML：

<form name="myForm" action="demo_form.asp" onsubmit="return validateForm()" method="post">
   First name: <input type="text" name="fname">
   <input type="submit" value="Submit">
</form>

现在将validateForm()添加为

function validateForm() {
   // Validate all fields in the form
   return true; // if all form entries are valid. else return false
}

注意：这不会使提交按钮变灰。但在这种情况下，只有当所有条目都有效时，提交才能起作用。

- Wolf