Question

版本5.5.2中的Abide不验证隐藏字段。但是，这也意味着验证不适用于非活动选项卡中的字段。

示例代码可以是：

<form data-abide>
    <ul class="tabs" data-tab>
      <li class="tab-title active"><a href="#panel1">Tab Name</a></li>
      <li class="tab-title"><a href="#panel2">Tab Email</a></li>
    </ul>
    <div class="tabs-content">
      <div class="content active" id="panel1">
          <div class="name-field">
            <label>Your name <small>required</small>
              <input type="text" required pattern="[a-zA-Z]+">
            </label>
            <small class="error">Name is required and must be a string.</small>
          </div>
      </div>
      <div class="content" id="panel2">
          <div class="email-field">
            <label>Email <small>required</small>
              <input type="email" required>
            </label>
            <small class="error">An email address is required.</small>
          </div>
      </div>
    </div>
  <button type="submit">Submit</button>
</form>

<script>
    $(document).foundation();
</script>

住在这里：http://jsfiddle.net/1ukfgwqt/（在点击提交之前不要点击第二个标签页。）

除了降级到5.5.1或手动编辑Foundation的JS文件之外，有没有办法重新启用隐藏字段的验证或修复非活动标签的验证（直到issue I reported被修复）？

Answer 1

我有同样的问题。我的解决方案是在标签上进行回调，并且像这样回复：

    $(document).foundation({
        tab: {
            callback: function (tab) {
                $(document).foundation('abide', 'reflow');
            }
        }
    });

基金会的Abide验证和标签

1 个答案: