在没有提交表单的情况下触发欧芹验证？答案

【问题标题】：Trigger parsley validation without submit form?在没有提交表单的情况下触发欧芹验证？
【发布时间】：2014-05-11 23:13:27
【问题描述】：

鉴于此代码，它永远不会工作并且总是返回 true ？

<form id="my-form" data-validate="parsley">
  <p>
    <label for="username">Username * :</label>
    <input type="text" id="username" name="username" data-required="true" >
  </p>

  <p>
    <label for="email">Email Address * :</label>
    <input type="text" id="email" name="email" data-required="true" >
  </p>

  <br/>

  <!-- Validate all the form fields by clicking this button -->
  <a class="btn btn-danger" id="validate" >Validate All</a>
</form>

<script>
var $form = $('#my-form');
$('#validate').click (function () {
    if ( $form.parsley('validate') )
      console.log ( 'valid' ); <-- always goes here
    else
      console.log ('invalid');
});

</script>

所以我的问题是，是否有办法在不添加提交按钮的情况下触发欧芹验证？

【问题讨论】：

标签： javascript parsley.js

【解决方案1】：

$form.parsley('validate') 是 1.x API。它在您可能使用的 2.x 版本中已被弃用。

改用$form.parsley().validate()。

最好的

【讨论】：

我一直很难找到清晰（或冗长）的 Parsley 文档，并且不确定它是 1.x 还是 2.x。谢谢你。
@macloo，他们的文档有“将 data-parsley-validate 添加到您想要验证的每个
”，然后在下面用大红字写几行“不要添加 data-parsley-验证您的表格”。 o_O
@EdmundReed 嗨，红色的大段“不要添加 data-parsley-validate”只涉及 javascript 的使用。如果你在 javascript 中绑定 parsley，添加这些 DOM 属性会搞砸。这在文档中可能不是很清楚，但它有一些逻辑:)
var parsley = $('#form').parsley(); var validate = parsely.validate(); var isValid = parsley.isValid();。非常感谢@guillaumepotier。
@guillaumepotier，你好 Guillaume，我知道这是一篇旧文章，但你如何触发对日历/日期脚本（jQuery Calendars Datepicker）的立即重新检查？该字段不适用于 keyup。我在鼠标移动失败后尝试了触发器，但它仅在用户移动到该特定字段时才有效。谢谢

【解决方案2】：

我一直在寻找高低尝试使表单验证与非表单标记一起工作。我想我对框架最大的抱怨是它不能开箱即用地处理非表单元素。如果每次尝试验证时它都没有滚动到页面顶部，我可以使用表单元素。因为这种行为是表单工作方式固有的，所以只有这个 hack 来修复它。

顺便说一句，在 div 标签上使用 data-parsley-validate 属性也可以。您还可以正常初始化表单（这意味着您可以订阅验证）。

示例 html：

<div id="signupForm" data-parsley-validate>
    ... put form inputs here ...
    <button id="signupBtn">Sign me up</button>
</div>

只要确保把js放进去：

var $selector = $('#signupForm'),
    form = $selector.parsley();

form.subscribe('parsley:form:success', function (e) {
    ...
});

$selector.find('button').click(function () {
    form.validate();
});

【讨论】：

【解决方案3】：

如果你把 type="button" 放在按钮上，点击时它不会刷新并滚动到页面顶部。

【讨论】：