簡單的表單驗證

1.app

<script>ide

function showTip(tipTxt){ui

var div=document.createElement('div');this

div.innerHTML='<div class="1"><p>'+tip+'</p></div>';spa

var tipNode=div.firstChlid;orm

$("#wrap").after(tipNode);ip

setTimeout(function(){rem

$(tipNode).remove();input

},1500);it

}

function tgsubmit(){

var name=$('#name').val();

if($.trim(name)==""){

showTip('請輸入姓名');

return false;

}

var sex=$("#sex").val();

var year=$("#year").val();

var patrn=/^[0-9]{1,2}$/;

if(!patrn.exec($.trim(year))){

showTip('請輸入年齡');

return false;

}

var mobile=$("#mobile").val();

if($.trim(mobile)==""){

showTip("請正確填寫手機號碼");

return false;

}

var patrn=/^13[0-9]{9}$|^15[0-9]{9}$|^18[0-9]{9}$/;

if(!patrn.exec($.trim(mobile))){

showTip('請正確輸入手機號碼');

return false;

}

return false;

}


</script>

2.


$(function(){

       // document.forms[0].reset();//重置表單

  $("form :input").val("");//清空表單value值

$("form :input").blur(function(){

var $parent=$(this).parent();

$parent.find(".formtips").remove();

if($(this).is("#phone")){

$(this).val()=="";

if(this.value==""||this.value.length!=11){

var errorMsg="請輸入正確的手機號碼";

$parent.append('<span class="formtips error">'+errorMsg+'</span>');

}

else{

var okMsg="輸入正確";

$parent.append('<span class="formtips success">'+okMsg+'</span>');

}

}

if($(this).is('#pwd')){

if(this.value==""||this.value.length<6){

var errorMsg="請輸入至少6位密碼";

$parent.append("<span class='formtips error'>"+errorMsg+"</span>");

}

else{

var okMsg="輸入正確";

$parent.append("<span class='formtips success'>"+okMsg+"</span>");

}

}  

 

 

}).keyup(function(){

$(this).triggerHandler('blur');

}).focus(function(){

$(this).triggerHandler('blur');

});

$(".con_submit").click(function(){

$('form .required:input').trigger('blur');

var numError=$("form .error").length;  

if(numError){

return false;

}  

alert("登陸成功!");  

 });




})

相關文章
相關標籤/搜索