0

我创建了一个多部分表单,需要验证表单上可见字段集中的已完成字段。如果所有必填字段均已填写,则将启用下一步按钮。

到目前为止,我玩过一些选项,但没有一个是 100% 有效的

HTML:

<div id="set1">
  <fieldset>
  <div>
    <label>field 1</label>
    <input name="f1" type="text" /><br />
    <span class="error"></span>
  </div>
  <div>
    <label>field 2</label>
    <input name="f2" type="text" /><br />
  </div>
  </fieldset>
</div>
<div id="set2">
  <fieldset>
  <div>
    <label>field 3</label>
    <input name="f3" type="text" /><br />
    <span class="error"></span>
  </div>
  .
  .
  .
  </fieldset>
</div>

jQuery:

$input = $('fieldset:visible div:has(span[class="error"]) input');
$next = $('fieldset:visible .button');
$input.keyup(function() {
  $input.each(function() {
    var trigger = false;
    $input.each(function() {
      if (!$(this).val()) {
        trigger = true;
      }
    });
    trigger ? $next.attr('class', 'disable') : $next.removeAttr('class');                           
  });
});

有人可以帮我理解我做错了什么吗?看来 keyup 事件没有触发。

4

2 回答 2

0

您应该使用 jQuery 验证器。它会让你的生活更轻松:

jQuery 验证

于 2012-01-18T14:04:11.960 回答
0

首先,keyup 事件将被触发,不用担心。第二件事,这行有一个严重的错误,if (!$(this).val()) {这是由于标准javascript中的错误思维造成的。翻译成你想测试该值是否存在。事实是,价值永远存在。它只是“”或一个真正的价值。

我的例子。希望经过一些更正后,它可以按您的意愿工作。

于 2012-01-18T15:20:39.243 回答