在填写每个必填字段之前，如何使用jQuery禁用表单的提交按钮？
我有一个包含多个输入，选择框和文本区域的表单。 我希望禁用提交按钮，直到我指定为所需的所有字段都填充了一个值。 在它们全部填满之后，如果用户擦除了WAS字段的字段，我希望提交按钮再次返回到禁用状态。
我怎样才能用jQuery实现这个目标？
猜测我的第一直觉是每当用户开始修改任何输入时运行一个函数。 像这样的东西：
$('#submitBtn').prop('disabled', true); $('.requiredInput').change(function() { inspectAllInputFields(); });
然后，我们将有一个检查每个输入的函数，如果它们已经过validation，则启用提交按钮……
function inspectAllInputFields(){ var count = 0; $('.requiredInput').each(function(i){ if( $(this).val() === '') { //show a warning? count++; } if(count == 0){ $('#submitBtn').prop('disabled', false); }else { $('#submitBtn').prop('disabled', true); } }); }
如果存储输入值或者您的其他代码填充数据它仍然可以正常工作，您可能还希望在页面加载时以这种方式添加对inspect函数的调用。
inspectAllInputFields();
希望这有帮助，〜马特
这是一个全面的东西，因为：
$(document).ready(function() { $form = $('#formid'); // cache $form.find(':input[type="submit"]').prop('disabled', true); // disable submit btn $form.find(':input').change(function() { // monitor all inputs for changes var disable = false; $form.find(':input').not('[type="submit"]').each(function(i, el) { // test all inputs for values if ($.trim(el.value) === '') { disable = true; // disable submit if any of them are still blank } }); $form.find(':input[type="submit"]').prop('disabled', disable); }); });
在提交按钮上设置disabled属性。 喜欢：
$('input:submit').attr('disabled', 'disabled');
并在表单字段上使用.change（）事件。
从禁用按钮开始（显然）。 将onkeyup事件绑定到每个必需的文本输入，并将onchange或onclick绑定到选择框（以及任何单选按钮/复选框），当它触发时，检查是否填写了所有必需的输入。 如果是这样，请启用该按钮。 如果没有，请禁用它。
但是，这里有一个漏洞。 用户可以删除文本字段的值而不触发onkeyup事件，方法是使用鼠标“剪切”文本，或者在删除所有文本后按住删除/退格键，然后在删除之前单击按钮。
你可以绕过第二个
- 使用
onkeydown禁用按钮并检查onkeyup是否正常 - 单击按钮时检查有效性
我的想法：
- 定义一个变量 – 带全局范围 – 并添加值true-在检查中写一个提交函数，使其高于varibale。 如果值为true，则仅评估提交事件。
- 编写一个函数，从输入字段和选择字段中查找所有值。 检查值的长度为零。 如果一个字段的值的长度为零，则将全局变量的值更改为false。
- 之后，将事件’onKeydown’或’onKeyUp’添加到所有输入字段，并将所有选择框添加到事件’onChange’。
我建议采用略有不同的方法并使用jquery的validationhttp://docs.jquery.com/Plugins/validation 。 你建议的策略容易出现安全漏洞。 用户可以轻松使用firebug启用该按钮，然后提交表单。
使用jqueryvalidation是干净的，如果需要提交，它允许您在必填字段下显示错误消息。