jquery validation de formulaire ne fonctionne pas

J'essaie d'apprendre les bases de jquery alors je commence à construire ma propre validation de jquery.i essayé de construire jquery validation de formulaire, mais il ne fonctionne pas.je ne sais pas quelle est la faute.Si quelqu'un ont idée s'il vous plaît essayer d'aider à apprendre jquery dans un meilleur code way.my est ici: -jquery validation de formulaire ne fonctionne pas

<script src="jquery.min.js" type="text/javascript"></script> 
<link href="css/templatemo_style.css" rel="stylesheet" type="text/css" /> 
<script type="text/javascript"> 
$(document).ready(function(){ 
    $('#submit').click(function(){ 
     var a = $("#email").val(); 
     var filter = /^[a-zA-Z0-9]+[a-zA-Z0-9_.-]+[a-zA-Z0-9_-][email protected][a-zA-Z0-9]+[a-zA-Z0-9.-]+[a-zA-Z0-9]+.[a-z]{2,4}$/; 
     if($('#fname').val()){ 
      if($('#fname').val()==""){ 
       $('#err_msg_1').html('fname field is empty'); 
       return false; 
      }else{ 
       if($('#fname').val().length>=4){ 
        $('#err_msg_1').html('letter length is to sort'); 
       return false; 
       } 
      } 
     } 
     if($('#fname').val()){ 
      if($('#lname').val()==""){ 
       $('#err_msg_2').html('lname field is empty'); 
       return false; 
      }else{ 
       if($('#lname').val().length>=4){ 
       $('#err_msg_2').html('letter length is to sort'); 
       return false; 
      } 
     } 
     /*if($('.gender').val()==""){*/ 
      if($('.gender')[0].selectedIndex<=0){ 
      $('#err_msg_3').html('gender field is empty'); 
      return false; 
     } 
     if(filter.test(a)==false){ 
      //email.addClass("error"); 
     $('#err_msg_email').html("Type a valid e-mail please"); 
     //emailInfo.addClass("error"); 
      return false; 
     } 



    });return true; 
}); 

</script> 

<div class="form"> 
    <form name="form" methode="POST" action=""> 
    <div class="container"><div class="fieldname">First Name</div><div class="field"><input name="fname" type="text" id="fname"></div><div class="error" id="err_msg_1"></div></div> 
    <div class="container"><div class="fieldname">Last Name</div><div class="field"><input name="fname" type="text" id="lname"></div><div class="error" id="err_msg_2"></div></div> 
    <div class="container"><div class="fieldname">Gender</div><div class="field"> 
    <select name="gender" class="gender" > 
     <option value="">---select gender---</option> 
     <option value="male">male</option> 
     <option value="female">female</option> 
    </select>  
    </div><div class="error" id="err_msg_3"></div></div> 
    <div class="container"><div class="fieldname">Email</div><div class="field"><input name="email" type="text" id="email"></div><div class="error" id="err_msg_email"></div></div> 
    <div class=""><input name="submit" type="submit" id="submit"></div> 
    <div id="check"><div> 
    </form> 
</div>

Source

2013-05-27 Ankur Saxena

I ont créé un JSFiddle pour vous: http://jsfiddle.net/NtJV9/ –

désolé mais ça ne fonctionne pas vérifier. –

une suggestion que je pourrais avoir et je sais que ce n'est pas la réponse, mais je dois le souligner est que vous devez mettre en cache les sélecteurs. c'est à dire. : $ ('# fname') est beaucoup utilisé et vous pouvez extraire dans une variable. –

Il y avait une erreur de syntaxe et de nombreuses erreurs logiques

$(document).ready(function(){ 
    $('#submit').click(function(){ 
     if(!$('#fname').val()){ 
      $('#err_msg_1').html('fname field is empty').show(); 
      return false; 
     }else{ 
      if($('#fname').val().length <= 4){ 
       $('#err_msg_1').html('letter length is to sort').show(); 
       return false; 
      } 
     } 
     $('#err_msg_1').hide(); 

     if(!$('#lname').val()){ 
      $('#err_msg_2').html('lname field is empty').show(); 
      return false; 
     }else{ 
      if($('#lname').val().length<=4){ 
       $('#err_msg_2').html('letter length is to sort').show(); 
       return false; 
      } 
     } 
     $('#err_msg_2').hide(); 

     /*if($('.gender').val()==""){*/ 
     if(!$('.gender').val()){ 
      $('#err_msg_3').html('gender field is empty').show(); 
      return false; 
     } 
     $('#err_msg_3').hide(); 

     var a = $("#email").val(); 
     var filter = /^[a-zA-Z0-9]+[a-zA-Z0-9_.-]+[a-zA-Z0-9_-][email protected][a-zA-Z0-9]+[a-zA-Z0-9.-]+[a-zA-Z0-9]+.[a-z]{2,4}$/; 
     if(!filter.test(a)){ 
      console.log('asdf') 
      $('#err_msg_email').html("Type a valid e-mail please").show(); 
      return false; 
     } 
     $('#err_msg_email').hide(); 
    }); 
    return true; 
});

Démo: Fiddle

Source

2013-05-27 08:10:53

: -merci vous utilisez console.log ('asdf') .pourquoi nous utilisons console.log() cette chose. .... –

@AnkurSaxena c'était un stmt de débogage, vous pouvez l'enlever –

jquery validation de formulaire ne fonctionne pas

Répondre

Questions connexes