标签: html5-validation

看起来字段的minlength属性<input>不起作用.

HTML5中是否还有其他属性可以帮助我设置字段值的最小长度？

我正在使用HTML5来验证字段.我在点击按钮时使用JavaScript提交表单.但HTML5验证不起作用.它仅在输入类型为时才有效submit.我们可以做除了使用JavaScript验证或更改类型之外的任何事情submit吗？

这是HTML代码:

<input type="text" id="example" name="example" value="" required>
<button type="button"  onclick="submitform()" id="save">Save</button>

我在函数中提交表单submitform().

如何使用CSS设置HTML5表单验证错误消息的样式？

我集成了新的隐藏reCAPTCHA(v2)框架,该框架默认使用click提交按钮的事件验证用户.但是在内置HTML5表单验证之前触发此事件.我正在寻找一种方法,使其按预期的顺序进行:首先是表单验证,然后是reCAPTCHA.

我正在将"HTML4.5"方法应用于现有的XHTML1.0 Strict站点.我们的想法是更改doctype并应用与HTML5的新元素(< div class="aside">等等)相匹配的语义类,并执行我可以使用的所有内容,而不会破坏Internet Explorer(IE)(例如应用新<input>类型属性).

我遇到的唯一问题是W3C的验证器不喜欢 或者©,而html5.validator.nu没有问题.

我知道HTML5验证器在这个阶段是实验性的.我应该换 一些东西吗？如果是这样,什么？

我在这个特定网站上的字符集是UTF-8.

我想知道是否有任何方法以编程方式显示HTML5验证错误,使用JavaScript函数.

这对于必须检查电子邮件复制的情况很有用.例如,一个人输入一封电子邮件,按下"提交"按钮,然后必须通知此电子邮件已经注册或者其他内容.

我知道还有其他方法可以显示这样的错误,但我希望以与验证错误消息的显示方式相同的方式显示它(例如无效的电子邮件,空字段等).

JSFiddle: http ://jsfiddle.net/ahmadka/tjXG3/

HTML表格:

<form>
    <input type="email" id="email" placeholder="Enter your email here..." required>
    <button type="submit">Submit</button>
</form>

<button id="triggerMsg" onclick="triggerCustomMsg()">Trigger Custom Message</button>

JavaScript的:

function triggerCustomMsg()
{
    document.getElementById("email").setCustomValidity("This email is already used");

}

上面的代码设置自定义消息,但不会自动显示.只有当用户按下提交按钮或其他内容时才会显示.

Angular UI Bootstrap引入了几个新的HTML标记,例如accordion和accordion-group.Angular在教授浏览器使用这些新技巧方面做得很好.

但是,我如何教Visual Studio不抱怨未知元素？也许有一种方法可以告诉Visual Studio标签或编写不使用非标准标签的HTML的方法.

我试图按钮单击处理表单验证.它正在验证表单但不显示错误.任何人都可以帮助我吗？

<form id="the-form" action="#">
    <input type="text" required="required" placeholder="Required text" />
    <input type="email" required="required" placeholder="email" />
    <button id="btn" type="button">Submit</button>
</form>

JavaScript的:

$("#btn").on("click", function(){
    if($("#the-form")[0].checkValidity())
    {
        alert('validated');
    }
    else
    {
        //show errors
        return false;
    }
});

http://jsfiddle.net/5ycZz/

在Firefox或Chrome中查看这两个小提琴.在这一个中,我只有一个带有required属性和submit按钮的简单表单.当框为空时按"提交"使其被设置为样式invalid(在Firefox中,它是红色轮廓).但它等到你按提交显示它无效.

现在尝试这个.它是相同的,除了有一些CSS:

input:invalid{
    border-color:orange
}

除此之外,即使在按下提交之前,也会应用橙色边框颜色.因此,当且仅当您手动invalid为表单设置样式时,浏览器才会应用它,这不是直观的行为.当然,在您输入任何内容之前,必填字段将无效.

有没有办法来解决这个问题？

我目前正在使用angular2进行验证.我在HTML5电子邮件和网站验证器以及validngModel属性方面遇到了一些问题.

例如:

<form #form="ngForm">
    <input type="email" #email="ngModel" [(ngModel)]="contact.email" name="email" >
    <button [disabled]="!form.form.valid" type="submit">Btn</button>

我输入的每个单词都很好.#email.valid仍然如此,好像没有HTML5验证器存在:

{{#email.valid}} %%% true

因此表单的按钮始终处于启用状态.但是,当我点击按钮时,HTML警告出现说电子邮件字段无效,因此验证工作正常,但#email.valid它仍然是正确的.

是否可以将angular2的ngModel指令与HTML5验证器一起使用？