js 表单验证

$(document).ready(function(){
var ok1 = false;
var ok2 = false;
var ok3 = false;
var ok4 = false;
$('#title').focus(function(){
$(this).next().text('请输入姓名').removeClass('state1').addClass('state2');
}).blur(function(){
if($(this).val()!=''){
$(this).next().text("输入成功").removeClass('state1').addClass('state3');
ok1=true;
}else{
$(this).next().text('姓名不能为空').removeClass('state1').addClass('state3');
}
});

$('#phone').focus(function(){
$(this).next().text('请输入联系电话').removeClass('state1').addClass('state2');
}).blur(function(){
if($(this).val()!='' && $(this).val().length==11){
$(this).next().text("输入成功").removeClass('state1').addClass('state3');
ok2=true;
}else{
$(this).next().text('输入错误').removeClass('state1').addClass('state3');
}
});
$("#car_models").focus(function(){

$(this).next().text('请选择车型').removeClass('state1').addClass('state2');
}).blur(function(){
if($(this).val()!='未选择车型(易车)'){
$(this).next().text("输入成功").removeClass('state1').addClass('state3');
ok3=true;
}else{
$(this).next().text('未选中车型').removeClass('state1').addClass('state3');
}
});
$("#dealer").focus(function(){
$(this).next().text('请选择经销商').removeClass('state1').addClass('state2');
}).blur(function(){
if($(this).val()!='未选择经销商'){
$(this).next().text("输入成功").removeClass('state1').addClass('state3');
ok4=true;
}else{
$(this).next().text('未选择经销商').removeClass('state1').addClass('state3');
}
});




$("form").submit(function(e){
if(ok1 && ok2 && ok3 && ok4){
return true;

}
return false;




});
});

<style>
.state1{
color:#aaa;
}
.state2{
color:#000;
}
.state3{
color:red;
}
.state4{
color:green;
}
</style>
posted @ 2018-02-28 14:05  未解  阅读(130)  评论(0编辑  收藏  举报