submit提交判断

最新推荐文章于 2019-01-28 15:25:36 发布

转载最新推荐文章于 2019-01-28 15:25:36 发布 · 1.3k 阅读

4 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/y369/p/9255362.html

文章标签：

#python #javascript #ViewUI

body部分

<form action='https://www.baidu.com' method='post' >
          用户名:<input type="text" name="username">
                  <span class='state1'>请输入用户名</span><br/><br/>
          密　　码:<input type="password" name="password">
                    <span class='state2'>请输入密码</span><br/><br/>
          确认密码:<input type="password" name="repass">
                  <span class='state3'>请输入确认密码</span><br/><br/>
          邮　　箱:<input type="text" name="email">
                  <span class='state4'>请输入邮箱</span><br/><br/>
      <input type="submit" class="submit" value="登录">
  </form>

style部分

      .state1{
          color:#aaa;
      }
      .state2{
          color:#000;
      }
      .state3{
          color:red;
      }
      .state4{
          color:green;
      }

script部分

//验证密码
$('input[name="password"]').focus(function(){
$(this).next().text('密码应该为6-20位之间').removeClass('state1').addClass('state2');
}).blur(function(){
if($(this).val().length >= 6 && $(this).val().length <=20 && $(this).val()!=''){
$(this).next().text('输入成功').removeClass('state1').addClass('state4');
ok2=true;
}else{
$(this).next().text('密码应该为6-20位之间').removeClass('state1').addClass('state3');
}

});

  //验证确认密码
  $('input[name="repass"]').focus(function(){
$(this).next().text('输入的确认密码要和上面的密码一致,规则也要相同').removeClass('state1').addClass('state2');
  }).blur(function(){
if($(this).val().length >= 6 && $(this).val().length <=20 && $(this).val()!='' && $(this).val() == $('input[name="password"]').val()){
  $(this).next().text('输入成功').removeClass('state1').addClass('state4');
  ok3=true;
}else{
  $(this).next().text('输入的确认密码要和上面的密码一致,规则也要相同').removeClass('state1').addClass('state3');
}

});

  //验证邮箱
  $('input[name="email"]').focus(function(){
  $(this).next().text('请输入正确的EMAIL格式').removeClass('state1').addClass('state2');
  }).blur(function(){
if($(this).val().search(/\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*/)==-1){
  $(this).next().text('请输入正确的EMAIL格式').removeClass('state1').addClass('state3');
}else{
  $(this).next().text('输入成功').removeClass('state1').addClass('state4');
  ok4=true;
}

});

//提交按钮,所有验证通过方可提交

  $('.submit').click(function(){
if(ok1 && ok2 && ok3 && ok4){
  $('form').submit();
}else{
  alert("请正确注册后登录")
  return false;
}
  });

});
</script>

转载于:https://www.cnblogs.com/y369/p/9255362.html