jquery - 欧芹 - 在表单顶部显示所有错误

Question

我刚刚完成了我用欧芹制作的表格。我第一次使用欧芹，所以我还不是100%熟悉它。

因此，我想在表单顶部显示无效输入字段中发生的所有错误。但我真的不知道我到底该怎么做。我已经尝试过使用 .clone() 和 .appendTo() 但随后一切都变得很奇怪，整个页面都充满了错误..

我很感激你们可能拥有的每一个解决方案!

我做了一个简短的片段，向大家展示我的真正意思。

$('button').on('click', function(e) {
  $('.catch-errors').css('display', 'block');
});
  

.catch-errors {
  display: none;
  margin-bottom: 15px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
  <div class="catch-errors">This field is required.<br>This field is required.</div>
  <input type="text" required>
  <input type="email" required>
  <button>Submit</button>
</form>

Answer 1

您不想预先填充错误，请使用 clone或appendTo .

我认为你可以指定 errorsContainer这将创建一个 <div>按需在顶部部分。