zoukankan      html  css  js  c++  java
  • 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>
  • 相关阅读:
    洛谷P1455 搭配购买(并查集)
    洛谷 P2078 朋友(并查集)
    TheZealous的集训日常之 离线算法与在线算法区别
    综合练习: Python自动化测试--从Excel读取数据并录入mysql
    读取excel/CSV/json数据
    Python 日志
    python 操作数据库
    python requests 接口: 调用百度开发者平台图片文字识别接口
    接口测试理论 2
    接口测试理论 1
  • 原文地址:https://www.cnblogs.com/wxc1/p/8483332.html
Copyright © 2011-2022 走看看