jQuery验证 - 如何显示上的错误的默认标注？ [英] jQuery Validation - How to display the default callout on errors?
问题描述
如果我创建这样一个输入控件：
If I create an input control like this:
<input type="number">
它
和类型的信件，将显示在一个弹出式控制的误差。我已经看到了它被称为的标注的，但我不知道这是正确的名称。它看起来是这样的：
And type letters in it, an error will be displayed in a popup-like control. I've seen it referred to as a callout but I'm not sure if that's the right name. It looks like this:
但是，如果我无论是在 jQuery的验证插件或在ASP.NET中定义自己的规则，那么就没有花哨的弹出了，只是一个标签，附加。它看起来并不几乎一样好，这是不符合上述非常一致无论是。
But if I define my own rules in either the jQuery Validation Plugin or in ASP.NET then there's no fancy popup anymore, just a label which is appended. It doesn't look nearly as good and it isn't very consistent with the above either.
有一个简单的方法，使我的自定义错误信息以同样的方式显示出来？
Is there a simple way to make my custom error messages show up in the same way?
推荐答案
您的图片显示了渲染默认HTML5验证（或不呈现的）具体的浏览器版本完全不同。
Your picture shows the default HTML5 validation which is rendered (or not rendered) depending solely on the specific browser version.
浏览器必须支持HTML5的验证才能看到这些弹出窗口和Chrome浏览器的弹出窗口会看起来比Firefox的不同等HTML5验证配置为使用的 HTML5属性验证您要添加的内联的每个这样的输入元素...
The browser must support HTML5 validation in order to see these pop-ups and Chrome's pop-ups will look different than Firefox's, etc. HTML5 validation is configured using HTML5 validation attributes that you'd add inline to each input element like this...
<input type="number" required="required" max="5" ....
但是，当您使用 jQuery的验证插件，它动态地添加 NOVALIDATE 属性添加到＆LT;形式为GT; 标记...
However, when you employ the jQuery Validate plugin, it dynamically adds the novalidate attribute to the <form> tag...
<form novalidate="novalidate" id="myform" ....
的 NOVALIDATE 属性用于的停用的HTML5的验证，使JQuery验证可以接管所有表单验证，而不从HTML5的干扰。是的，默认的jQuery的验证标签是平淡无奇，但是这是空白画布，它允许设计灵活性，跨浏览器的一致性和可靠性。见下文。
The novalidate attribute is used to disable the HTML5 validation so that jQuery Validate can take over all form validation without interference from HTML5. Yes, the default jQuery Validate labels are bland, but that's the "blank canvas" which allows design flexibility and cross-browser consistency and reliability. See below.
如果你想看起来更像是弹出窗口你会用HTML5得到错误信息，那么你可以创建自己的CSS / jQuery的。
If you want error messages that look more like the pop-ups you'd get with HTML5, then you can create your own with CSS/jQuery.
引用：
的有一个简单的方法，使我的自定义错误信息以同样的方式显示出来？的
这，如果你想增加一个jQuery插件很简单依赖。你可以集成一个jQuery插件如 qTip2 或的 ToolTipster 到jQuery的验证。这些插件有很多选择，主题和CSS，你可以自定义没有结束。它可能会非常棘手，虽然每个插件被取决于它是如何工作的集成方式不同，其操作方法，回调等。
That depends on if you think adding another jQuery plugin is simple. You could integrate a jQuery plugin like qTip2 or ToolTipster into jQuery Validate. These plugins have many options, themes, and CSS that you can customize to no end. It can be tricky though as each plugin gets integrated differently depending on how it works, its manipulation methods, callbacks, etc.
下面是展示如何ToolTipster V3（默认 - 无主题）一个工作演示很容易集成到jQuery的验证：
Here's a working demo showing how ToolTipster v3 (default - no theme) was easily integrated into jQuery Validate:
源代码：<一href=\"http://stackoverflow.com/questions/14741688/how-to-display-messages-from-jquery-validate-plugin-inside-of-tooltipster-toolti\">How到Tooltipster提示里面显示来自jQuery的验证插件的消息？
这篇关于jQuery验证 - 如何显示上的错误的默认标注？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
