Validform

時間 2019-11-10

標籤 validform 简体版

原文原文鏈接

1.index.htmljavascript

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Demo - Validform - 一行代碼搞定整站的表單驗證！ &copy;瑞金佬的前端路</title>
<link rel="stylesheet" href="css/style.css" type="text/css" media="all" />
</head>

<body> 
<form  id="form" action="index.php"> 
<span>
<label>用戶名：</label><input type="text" datatype="mobile" errormsg="填寫正確的手機號" sucmsg="手機號可註冊" name="mobile" ><span class="validform_checktip"></span>
</span>
<br>
<!-- ignore="ignore" ajaxurl="index.php" 用於此input框的驗證 -->
<span>
<label>密碼：</label><input type="text" name="password" datatype="s6-12" errormsg="請輸入6-12位密碼" nullmsg="密碼不能爲空" name="password"><span class="validform_checktip"></span>
</span>
<br>
<span>
<label>確認密碼：</label><input type="text"  recheck="password" datatype="s6-12" errormsg="輸入密碼不一致" nullmsg="密碼不能爲空"><span class="validform_checktip"></span>
</span>
<br>
<span><input type="submit" value="提交"> </span>
<!-- <span><input type="submit" value="重置" id="btn_reset"> </span>
 --></form>
</body>
<script type="text/javascript" src="js/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="js/Validform_v5.3.2_min.js"></script>
<script type="text/javascript" src="../layer/layer.js"></script>
<script>
$(function(){
    $('#form').Validform({
        tiptype:4,
        //showAllError:true,
        //dragonfly:true,
        ajaxPost:true,//表單提交驗證
        btnReset:"#btn_reset",
         datatype:{
             mobile:/^1[3|5|7|8]\d{9}$/,
             email:/^\w+@\w{2,3}.\w{2,6}$/,
             /*mobile:function(data){
                 // var reg=/^1[3|5|7|8]\d{9}$/;
                 // if(reg.test(data)){
                 //     return true;
                 // }else{
                 //     return false;
                 // }
             }*/
         },
         postonce:true,
         callback:function(data){
             if(data.status=='y'){
                 layer.msg(data.info,{icon:1});
                 //location.href='http://www.baidu.com';
             }else{
                 layer.msg(data.info,{icon:2});

             }
             
         }
})     
    
})
</script>
</html>

2.index.phpphp

<?php
//echo $_POST['param'];
$str=['info'=>'註冊成功', 'status'=>'y'];
//$str=['info'=>'手機號已註冊', 'status'=>'n'];
echo json_encode($str);

相關標籤/搜索

validform

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。