检查HTML 5验证是否成功

时间:2014-06-26 10:14:24

标签: jquery html5 jquery-ui

我需要检查HTML 5本机验证是否成功。基于此,我需要调用ajax函数。

这里有一个示例代码。 http://jsfiddle.net/inDiscover/4Pbcp/

还提供如下示例代码。

<!DOCTYPE html>
<html>
    <head>
        <title>jQuery UI Dialog: Open Dialog on Clicksssssssssss</title>
        <link rel="stylesheet" href="../css/jquery-ui.css" />
        <link rel="stylesheet" href="../css/style.css" />
        <script type="text/javascript" src="../scripts/jquery.js"></script>
        <script type="text/javascript" src="../scripts/jquery-ui.js"></script>
        <script type="text/javascript" src="../scripts/jquery.validate.js"></script>

        <script type="text/javascript">
            $(function(){
                $("#pop_submit").click(function() 
                {
                    alert("am here");
                    //return false;
                });

            });
        </script>

    </head>
    <body>
        <div id="popup" style="display:block">
            <form action="" name="pop_up_form" id="pop_up_form" method="post">
                <input class="pop_up_textbox" type="text" name="acct_nmbr" id="acct_nmbr" required maxlength="19" value=""/>
                <input type="submit" name="pop_submit" id="pop_submit" style="display:block;" />
            </form>
        </div> 
    </body>
</html>

在jquery代码中,我在提交按钮时发出警报。但是我需要在成功的HTML 5本机验证之后才显示此警报。如果任何人可以指出我是如何实现这一点那么我可以在成功的HTML 5本机验证后调用ajax函数而不是警报消息。

我知道我们可以使用JQuery Validator通过使用valid()方法来验证表单,但我不想这样做。我需要知道我的HTML 5本机验证是否成功,如果是,我需要做一些逻辑。

1 个答案:

答案 0 :(得分:2)

checkValidity()方法(HTML5验证API的一部分)应该可以满足您的需求。本教程非常有助于解释本机HTML5表单验证方法:http://www.html5rocks.com/en/tutorials/forms/constraintvalidation/