温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

Jquery表单验证

发布时间:2020-07-05 01:11:27 阅读:287 作者:icyore 栏目:web开发
前端开发者测试专用服务器限时活动,0元免费领,库存有限,领完即止! 点击查看>>

环境:

jquery-1.10.1.min.js

jquery.validate.min.js

任务:表单验证

html:

<form action="" id="myform" method="POST">
<table class="" id="table1">
<tbody>
            <tr>
              <td class=""></td>
              <td><input type="text" id="name" name="name" value="" size="16" class=""></td>
              <td class="text_left" ></td>
            </tr>
            <tr>
              <td class=""></td>
              <td><input type="text" id="tel" name="tel" value="" size="16" class=""></td>
              <td class="text_left" ></td>
            </tr>
            <tr>
              <td class=""></td>
              <td><input type="text" id="addr" name="addr" value="" size="16" class=""></td>
              <td class="text_left" ></td>
            </tr>
            <tr>
              <td class=""></td>
              <td><input type="text" id="surplusnum" name="surplusnum" value="" size="16" class=""></td>
              <td class="text_left" ></td>
            </tr>
        </tbody>
    </table>
</form>

jquery:

$(function({
form.init();
});
//新加验证规则。
// 联系电话(手机/电话皆可)验证。
jQuery.validator.addMethod("isTel", function (value, element) {  
//(区号)-(直拨号)-(分机号)或者11位手机号。
//座机可以没有分机号(区号)-(直拨号)。
    var mobile = /^(((0\d{2,3})|(0\d{2,3}-))\d{7,8}(-\d{1,4})?)$|^(1[3584]\d{9})$/;
    
    if (!mobile.exec(value)) return false;
    return true;
}, "请正确填写停车点的联系电话"); 
 // 只能输入正整数。
jQuery.validator.addMethod("isSurplusnum", function (value, element) {  
    var num = /^[1-9][0-9]{0,2}$/;
    
    if (!num.exec(value)) return false;
    return true;
}, "请正确填写剩余车辆数");
// 验证表单。
var form = function({
return {
init : function({
$("#myform").validate({
rules : {
name : {
required true,
maxlength 100
},
addr : {
required true,
maxlength 200
},
tel : {
required true,
isTel "#tel",
minlength 4,
maxlength 18
},
surplusnum : {
required true,
min 0,
isSurplusnum:"#surplusnum",
max 500
}
},
messages : {
name : {
required "请输入名称",
maxlength "名称不得超过{0}个字符",
},
addr : {
required "请输入地址",
maxlength "地址不得超过{0}个字符",
},
tel : {
required "请输入联系电话",
maxlength "电话不能超过{0}个字符",
isTel "电话号码格式不正确",
},
surplusnum : {
required "请输入停车点车辆辆数",
max : jQuery.format("车辆辆数不得超过{0}辆"),
}
},
errorPlacement : function(error, element) {
if (element.parent().is('div')) {
error.appendTo(element.parent().parent().next());
} else {
error.appendTo(element.parent().next());
}
}
});
}
};
}

帮助:

正则表达式:http://msdn.microsoft.com/zh-cn/library/ae5bf541(VS.80).aspx

validate表单验证:http://www.jb51.net/article/36067.htm

亿速云「云服务器」,即开即用、新一代英特尔至强铂金CPU、三副本存储NVMe SSD云盘,价格低至29元/月。点击查看>>

向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

AI

开发者交流群×