jQuery validate入门

<html>
<head>
    <meta charset="utf8"></meta>
</head>
<body>
    <script src="http://code.jquery.com/jquery.js"></script>
    <script type="text/javascript"  src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.js"></script>
    <script type="text/javascript">
    $().ready(function() {
 //$("#signupForm").validate();//不推荐
 //此种方式需要将验证规则写在html中  且如果使用 class="{required:true,minlength:5,messages:{required:'请输入内容'}}"
 //这样的方式话  还需再添加一个jquery.metadata.js 包


 //方式2  将提示信息写入js中
 //在验证没有通过之前  插件会自动禁止提交
 $("#signupForm").validate({
     rules: {
         firstname: {
             required:true,
             remote:{
                 url:"check-name.php",
                 type:"get",
                 data:{
                     firstname:function(){
                         return $('input[name="firstname"]').val();
                     }
                 },
                 dataType:"json"
             }
         },
         email: {
             required: true,
             email: true
         },
         password: {
             required: true,
             minlength: 5
         },
         confirm_password: {
             required: true,
             minlength: 5,
             equalTo: "#password"
         }

     },
     messages: {
         firstname: {
             required:"请输入姓名",
             remote:"换一个"
         },
         email: {
             required: "请输入Email地址",
             email: "请输入正确的email地址"
         },
         password: {
             required: "请输入密码",
             minlength: jQuery.format("密码不能小于{0}个字 符")
         },
         confirm_password: {
             required: "请输入确认密码",
             minlength: "确认密码不能小于5个字符",
             equalTo: "两次输入密码不一致不一致"
         }
     }
 });
});
    </script>

    <form id="signupForm" method="get" action="coco.php">
        <p>
            <label for="firstname">Firstname</label>
            <input id="firstname" name="firstname" class="required" />
        </p>
        <p>
            <label for="email">E-Mail</label>
            <input id="email" name="email" class="required email" />
        </p>
        <p>
            <label for="password">Password</label>
            <input id="password" name="password" type="password" />
        </p>
        <p>
            <label for="confirm_password">确认密码</label>
            <input id="confirm_password" name="confirm_password" type="password" />
        </p>
        <p>
            <input class="submit" type="submit" value="Submit"/>
        </p>
    </form>
</body>

</html>

check-name.php

<?php
$name=$_REQUEST['firstname'];
$valid="";
if($name=="first"){
    $valid="false";
}else if($name=="aaa"){
    $valid="false";
}else{
    $valid="true";
}
echo $valid;
?>

 

 

转载于:https://www.cnblogs.com/cart55free99/p/3287377.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值