jquery validate的使用

最新推荐文章于 2025-04-05 18:14:53 发布

撒哈拉的绿洲

最新推荐文章于 2025-04-05 18:14:53 发布

阅读量515

点赞数

分类专栏： JS HTML

本文链接：https://blog.youkuaiyun.com/u011550635/article/details/39023097

版权

JS 同时被 2 个专栏收录

28 篇文章

订阅专栏

HTML

8 篇文章

订阅专栏

本文介绍了一个使用jQuery Validate插件实现的简单表单验证示例。该示例包含用户名和电子邮件两个字段，对输入进行必要的验证，如检查是否为空及电子邮件格式是否正确。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>jquery validate </title>
    <script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
    <script src="js/jquery.validate.js" type="text/javascript"></script>
    <meta http-equiv="content-type" content="text/html;charset=utf-8">
</head>
<script type="text/javascript">
    $(function(){
        $("#frmV").validate(
                {
                    rules:{
                        username:{required:true,minlength:6},
                        email:{required:true,email:true}
                    },
                    errorPlacement:function(error,element){
                        error.appendTo(element.siblings("span"));
                    },
                    messages: {
                        username: "请输入姓名",
                        email:"请输入正确的email地址"
                    }
                }
        );
    });
</script>
</head>
<body>
<form id="frmV" method="get" action="#">
    <div class = "divTitle">please input content</div>
    <div class = "divContent">
        <div>
            name:<br />
            <input id = "username" name="username" type="text" class="txt" />
            <font color="red"></font><br />
            <span></span>
        </div>

        <div>
            email:<br />
            <!-- email rule -->
            <input id = "email" name="email" type="text"  />
            <font color="red"></font><br />
            <span></span>
        </div>
    </div>
    <div class="divBtn">
        <input id = "sbtUser" type="submit" value ="sub" class="btn" />
    </div>
</form>
</body>
</html>