jquery提交表单验证示例代码
生活随笔
收集整理的這篇文章主要介紹了
jquery提交表单验证示例代码
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
用jquery.from.js加aswitch判斷寫表單驗證:
// 表單$("#btnSubmit_n4").click(function() {let user_name=$("#validate_n4").find("#user_name").val();let user_phone=$("#validate_n4").find("#user_phone").val();switch (true){case user_name=="":alert("請輸入姓名"); $("#user_name").focus(); break;case !/^((13[0-9]|15[0-9]|17[0-9]|18[0-9])+\d{8})$/.test(user_phone):alert("請輸入正確手機號碼"); $("#user_phone").focus(); break;default:$("#validate_n4").ajaxSubmit(function() {alert('提交成功!');$(".c-form")[0].reset();});}});用layer寫的表單驗證:
var x = /^[\u4e00-\u9fa5a-z]+$/;var t = /^((13|14|15|16|17|18|19)+\d{9})$/;function Submit() {if (!x.test($("#brand").val())) {layer.msg('請輸入品牌!', { icon: 7 });return false;}if (!$("#model").val()) {layer.msg('請輸入車型', {icon: 7});return false;}if (!$("#year").val()) {layer.msg('請輸入年月', {icon: 7});return false;}if (!$("#city").val()) {layer.msg('請輸入所在城市', {icon: 7});return false;}if (!$("#kilometre").val()) {layer.msg('請輸入里程', {icon: 7});return false;}if (!t.test($("#number").val())) {layer.msg('請輸入正確的手機號!', {icon: 7});return false;}$("#validate").ajaxSubmit(function() {layer.msg('提交成功,我們會盡快聯系您!', {icon: 1});$(".c-form ")[0].reset();});}js寫的干凈的表單驗證:
/*輸入框檢測js代碼 用法:<form action = '' οnsubmit="return FormValid.valid(this);"> */ var FormValid = {valid : function( obj ) {var elements = obj.elements;var length = elements.length;for( var i=0;i<length;i++ ) if( valid = elements[ i ].getAttribute( 'valid' ) ) if( !this.docheck( valid,elements[ i ] ) ) {alert( elements[ i ].getAttribute( 'errmsg' ) );return false;}return true;},Reg : {isQQ : /^[1-9]\d{4,11}$/,isNumber : /^[1-9]\d{1,}/,isZip : /^[1-9]\d{5}$/,isMobile : /^(13|15|18)\d{10}$/,isPhone : /^0\d{2,3}-\d{7,8}$/,isInt : /^[-\+]?\d+$/,isEmail : /([\w-\.]+)@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.)|(([\w-]+\.)+))([a-zA-Z]{2,4}|[0-9]{1,3})(\]?)/},docheck : function( valid,node_obj ) {switch( valid ) {case 'isQQ':case 'isNumber':case 'isZip':case 'isMobile':case 'isPhone':case 'isInt':case 'isEmail':var result = this.doReg( valid,node_obj );break;default:var result = eval( 'this.' + valid + '( node_obj );' );break;}if( !result )node_obj.focus();return result;},doReg : function( valid,node_obj ) {var regexp = this.Reg[ valid ] ;var result = regexp.test( node_obj.value );if( !result )node_obj.focus();return result;},required : function( node_obj ) {return node_obj.value != '';},range : function( node_obj ) {return node_obj.value>=node_obj.getAttribute( 'min' ) & node_obj.value<=node_obj.getAttribute( 'max' );},eq : function( node_obj ) {return node_obj.value == node_obj.getAttribute( 'eqValue' );},gt : function( node_obj ) {return node_obj.value >=node_obj.getAttribute( 'gtValue' );} }驗證郵箱和手機號碼
var user_phone=$("#validate").find("#user_phone").val(); var user_email=$("#validate").find("#user_email").val(); var user_phones=/^((13[0-9]|15[0-9]|17[0-9]|18[0-9])+\d{8})$/.test(user_phone)||/^[0-9]{3,4}[-][0-9]{8}$/.test(user_phone); var user_emails=user_email.match(/^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/); //然后判斷是否為空 if(user_phones&&user_emails){alert('格式成功!');}else if{alert('格式成功!'); return false;}驗證姓名只能是英文和漢字(/^[\u0391-\uFFE5A-Za-z]+$/)
var username=$("#ajaxForm").find("#username").val(); var usernames=/^[\u0391-\uFFE5A-Za-z]+$/.test(username);驗證輸入的位數(/^\d{4}$/)
var verifyCode = $("#myfrom").find("#verifyCode").val(); var verifyCodes = /^\d{4}$/.test(verifyCode);提交之后清空表單
$("#myfrom2")[0].reset();提交驗證(一):
<a href="javascript:confirm_delete('index.php?m=Guestbook&a=delete&id=647');">刪除</a> function confirm_delete(url){if(confirm('您確定要執行刪除操作?')){window.location.href=url;}else{return false;}}提交驗證(二):
if(confirm('是否確定提交?')) {return checkForm();}else{return false;}function checkForm(){$("#calcFrom").find("input").each(function(){if(this.value == '') {text = $(this).parent().prev().text();alert(text+"是必填項");this.focus();return false;//跳出each}});} });總結
以上是生活随笔為你收集整理的jquery提交表单验证示例代码的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: [转]myip.cn-电影格式转换器ww
- 下一篇: ssb