2016-07-11 13 views
1

Ich arbeite an einem Formular. Wenn kein Eingabefeld leer ist, wird eine Warnung angezeigt. Wenn ein Fehler auftritt (leeres Feld wurde übergeben), wird der Eingabe eine Klasse hinzugefügt, um einen Stil darauf anzuwenden.Eine Warnung anzeigen, wenn eine Bedingung mit jquery überprüft wird

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 
 
<script> 
 
    $(document).ready(function() { 
 
     $(".form-register").submit(function (e) { 
 

 
      e.preventDefault(); 
 

 
      if($(this).find('.error')){ 
 
       $(".error").animate({'margin-left': '0'}); 
 
       $(this).find('input').removeClass('error'); 
 
       $(this).find('select').removeClass('error'); 
 
      } 
 

 
      var email = $(this).find('input[name="email"]').val(); 
 
      if(!email){ 
 
       $(this).find('input[name="email"]').addClass('error'); 
 
       alert('Email can not be empty'); 
 
      } 
 

 
      var name = $(this).find('input[name="name"]').val(); 
 
      if(!name){ 
 
       $(this).find('input[name="name"]').addClass('error'); 
 
       alert('Name can not be empty'); 
 
      } 
 

 
      if($(this).find('.error')){ 
 
       $(".error").animate({'margin-left': '15px'}); 
 
      }else{ 
 
       alert('No error has been detected.'); 
 
      } 
 

 
     }); 
 
    }); 
 

 
</script> 
 

 
<style> 
 
    .form-register input.error { 
 
     border:1px solid #F5192F; 
 
     box-shadow:0 0 4px #F5192F; 
 
    } 
 
</style> 
 

 
<form class="form-register" method="post" action=""> 
 
    <input name="email" type="text"/> 
 
    <input name="name" type="text"/> 
 
    <input type="submit"/> 
 
</form>

Ich möchte eine Benachrichtigung angezeigt werden, wenn die Felder, aber keine Möglichkeit, nicht leer sind. Bitte helfen Sie mir, dieses Problem zu beheben. Danke

Antwort

2

if($(this).find('.error')) { wird immer wahr sein, auch wenn kein Element mit Klassenfehler in der Form vorhanden ist, wird jQuery ein leeres Array zurückgeben. Ändern Sie den Code in if($(this).find('.error').length > 0){, um den Alarm alert('No error has been detected.') anzuzeigen.

Verwandte Themen