仅使用parsley.js在提交时验证表单

叶夫根尼

我有一个简单的表格

<form action="#" method="GET" class="parsleyVal">
  <div class="input-group input-group-lg">
    <input type="email" name="email" class="form-control input-email" 
           placeholder="Enter your email"  
           data-parsley-required-message="Please enter your email address" 
           data-parsley-required title="Please enter your email address" 
           auto-complete="off" data-parsley-trigger="submit" />
    <span class="input-group-btn">
      <button class="btn btn-orange" type="submit"  data-parsley-trigger="click touch">
        Sign up
      </button>        
    </span>
  </div>
</form>

sign-up单击按钮即开始验证

但是,如果未指定电子邮件,则显示错误:

输入你的电子邮箱。

用户开始输入电子邮件地址时,parsley.js将进行自动验证并显示电子邮件必须有效。

parsley.js当再次单击“提交”按钮时,我想重新验证电子邮件字段,但不是立即进行。

在输入字段上尝试了xCodexInlinexPlacexHolderx-无济于事。

叶夫根尼

看来我终于明白了我想要的东西。

如果有人可以推荐其他方法,则可能不是理想的方法。

$('.parsleyVal input[type=email]').on('keyup keydown', function () {
            $('.filled').removeClass('filled');
            $('.parsleyVal').parsley().destroy();
        })

脚本删除了类以隐藏错误消息并破坏欧芹验证,这将在单击注册按钮时再次触发。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

提交表单时如何防止Parsley验证

来自分类Dev

提交表单时如何仅验证表单?

来自分类Dev

parsley.js表单验证-确认提交表单时未发现错误

来自分类Dev

使用Parsley.js仅验证ASP.net页上的一种表单

来自分类Dev

使用parsley.js进行html表单验证后的彩色提交按钮

来自分类Dev

使用angular.js提交表单时如何检查验证

来自分类Dev

使用Angular JS提交时隐藏表单

来自分类Dev

使用验证时无法在Struts 2中提交表单

来自分类Dev

使用外部API验证失败时提交的Javascript表单

来自分类Dev

使用JS提交时防止多表单提交

来自分类Dev

延迟Parsley.js表单提交

来自分类Dev

延迟Parsley.js表单提交

来自分类Dev

parsley.js正在验证但未提交

来自分类Dev

如何使用Parsley JS验证文件输入?

来自分类Dev

Parsley.js-验证仅数字的可选输入

来自分类Dev

如何使用angularJs在提交按钮不在此表单之外时验证表单?

来自分类Dev

当提交按钮位于表单之外时,如何使用Bootstrap 3表单验证?

来自分类Dev

Rspec:使用JS提交表单时模型未更新

来自分类Dev

使用纯JS提交表单时禁用beforeunload?

来自分类Dev

Rspec:使用JS提交表单时模型未更新

来自分类Dev

使用ng-repeat动态表单时,验证提交时所有表单字段的正确方法是什么?

来自分类Dev

从IE10中的孤立控件提交时使用必需属性进行表单验证

来自分类Dev

如何使用JavaScript验证JSP表单(提交时)中的多个文本框?

来自分类Dev

验证MySql表中的促销代码,并在提交表单时将其标记为“已使用”

来自分类Dev

使用“共享”按钮(而不是“提交”类型的输入元素)时,如何使表单验证工作?

来自分类Dev

使用Jquery插件提交表单时,如何在'。(。)之后验证电子邮件

来自分类Dev

使用Google reCAPTCHA验证表单的提交

来自分类Dev

如何使用Bootstrap验证提交表单

来自分类Dev

如何防止表单使用 AJAX 验证提交

Related 相关文章

  1. 1

    提交表单时如何防止Parsley验证

  2. 2

    提交表单时如何仅验证表单?

  3. 3

    parsley.js表单验证-确认提交表单时未发现错误

  4. 4

    使用Parsley.js仅验证ASP.net页上的一种表单

  5. 5

    使用parsley.js进行html表单验证后的彩色提交按钮

  6. 6

    使用angular.js提交表单时如何检查验证

  7. 7

    使用Angular JS提交时隐藏表单

  8. 8

    使用验证时无法在Struts 2中提交表单

  9. 9

    使用外部API验证失败时提交的Javascript表单

  10. 10

    使用JS提交时防止多表单提交

  11. 11

    延迟Parsley.js表单提交

  12. 12

    延迟Parsley.js表单提交

  13. 13

    parsley.js正在验证但未提交

  14. 14

    如何使用Parsley JS验证文件输入?

  15. 15

    Parsley.js-验证仅数字的可选输入

  16. 16

    如何使用angularJs在提交按钮不在此表单之外时验证表单?

  17. 17

    当提交按钮位于表单之外时,如何使用Bootstrap 3表单验证?

  18. 18

    Rspec:使用JS提交表单时模型未更新

  19. 19

    使用纯JS提交表单时禁用beforeunload?

  20. 20

    Rspec:使用JS提交表单时模型未更新

  21. 21

    使用ng-repeat动态表单时,验证提交时所有表单字段的正确方法是什么?

  22. 22

    从IE10中的孤立控件提交时使用必需属性进行表单验证

  23. 23

    如何使用JavaScript验证JSP表单(提交时)中的多个文本框?

  24. 24

    验证MySql表中的促销代码,并在提交表单时将其标记为“已使用”

  25. 25

    使用“共享”按钮(而不是“提交”类型的输入元素)时,如何使表单验证工作?

  26. 26

    使用Jquery插件提交表单时,如何在'。(。)之后验证电子邮件

  27. 27

    使用Google reCAPTCHA验证表单的提交

  28. 28

    如何使用Bootstrap验证提交表单

  29. 29

    如何防止表单使用 AJAX 验证提交

热门标签

归档