html5-validation – 在按钮点击时手动触发html5验证

前端之家收集整理的这篇文章主要介绍了html5-validation – 在按钮点击时手动触发html5验证前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我正在尝试按钮单击处理表单验证.它验证表单但不显示错误.
任何人都可以帮助我吗?
<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/

@H_301_12@解决方法
我通过以下步骤实现了这一目标:

1)我有形式:

<form>
    <textarea required></textarea>
    <input type="submit" style="display:none;"/>
</form>

<a>Some other button to trigger event</a>

2)现在我们必须检查表单是否填写正确:

//this is <a> click event:
if (!$('form')[0].checkValidity()) {
    $('form').find('input[type="submit"]').click();
    return false;
}

这将触发表单发送但不会发送,因为有错误;)

看来html5验证错误显示在输入[type =“submit”]上点击:)

希望对你也有用!

猜你在找的HTML5相关文章