什么是 jQuery 非侵扰性验证？

我知道 jQuery 验证插件是什么。我知道 jQuery 非侵扰验证库是微软开发的，并且包含在 ASP.NET MVC Framework 中。但是我找不到任何一个在线资源来解释它是什么。标准的 jQuery 验证库和“不引人注目”的版本有什么不同？

167841 次浏览
小开
最佳答案

Brad Wilson 有一些关于 不引人注目的确认和 不显眼的 Ajax的很棒的文章。
在“ AJAX 和 JavaScript”部分的 多视角视频中也很好地展示了这一点。

基本上，它只是 Javascript 验证，不会用它自己的 确认代码污染 你的源代码。这是通过在 HTML 中使用 data-属性来完成的。

小开

以一种不引人注目的方式:

  • 您不必调用 valid()方法。
  • 您可以使用数据属性(data-val、 data-val-need 等)指定需求

Jquery 验证示例 :

<input type="text" name="email" class="required">
<script>
$(function () {
$("form").validate();
});
</script>

Jquery 验证不引人注目示例 :

<input type="text" name="email" data-val="true"
data-val-required="This field is required.">


<div class="validation-summary-valid" data-valmsg-summary="true">
<ul><li style="display:none"></li></ul>
</div>
小开

JQuery 验证非侵入性本机是 ASP.Net MVC HTML 助手扩展的集合。 它们利用了 jQuery 验证对由 HTML5数据属性驱动的验证的本机支持。 微软在 MVC 3中发布了 jquery.validate.unobtrusive.js。 它提供了一种将数据模型验证应用到客户端的方法，这种方法结合了 jQuery 验证和 HTML5数据属性 (这是“不显眼”的部分)。

小开

为了便于澄清，这里有一个更详细的示例，演示了如何使用 jQuery ValidationUnobtrusion 进行表单验证。

两者都在 jQuery 中使用以下 JavaScript:

  $("#commentForm").validate({
submitHandler: function(form) {
// some other code
// maybe disabling submit button
// then:
alert("This is a valid form!");
//      form.submit();
}
});

这两个插件之间的主要区别在于每种方法所使用的属性。

JQuery 验证

只需使用以下属性:

  • 如果需要设置
  • 设置正确格式(电子邮件等)的类型
  • 设置其他属性，比如 size (min length 等)

这是表格。

<form id="commentForm">
<label for="form-name">Name (required, at least 2 characters)</label>
<input id="form-name" type="text" name="form-name" class="form-control" minlength="2" required>
<input type="submit" value="Submit">
</form>

JQuery 验证无干扰

需要以下数据属性:

  • Data-msg-need = “这是必需的。”
  • Data-rule-need = “ true/false”

这是表格。

<form id="commentForm">
<label for="form-x-name">Name (required, at least 2 characters)</label>
<input id="form-x-name" type="text" name="name" minlength="2" class="form-control" data-msg-required="Name is required." data-rule-required="true">
<input type="submit" value="Submit">
</form>

基于这两个示例中的任何一个，如果所需的表单字段已经填充，并且它们满足附加属性条件，那么将弹出一条消息，通知所有表单字段都已验证。否则，在有问题的表单字段附近将出现指示错误的文本。

参考文献: JQuery 验证: < a href = “ https://jqueryvalidation.org/document/”rel = “ norefrer”> https://jqueryvalidation.org/documentation/


提交答案