Alerts nicht zu sehen .. möchte E-Mail-gültig oder nicht überprüfen. Using jQuery

Ich versuche zu überprüfen, ob E-Mail gültig ist oder nicht jQuery verwenden, aber am Anfang habe ich Warnungen zu E-Mail-Werte sowie IndexOf Wert und lastIndexOf Wert, aber ich bin nicht in der Lage zu sehen, als wenn ich auf Ragster-Taste Bildschirm klicken kommen und geht sehr schnell.Alerts nicht zu sehen .. möchte E-Mail-gültig oder nicht überprüfen. Using jQuery

<script src="jquery-2.2.1.min.js"></script> 
<script> 
    $(document).ready(function() { 
    $(".sbt_button").click(function() { 
     var error_arr = []; 
     var email_value = $("#email").val(); 
     alert(email_value); 
     var position_of_at = email_value.value.indexOf('@'); 
     alert(position_of_at); 
     var position_of_dot = email_value.value.lastIndexOf('.'); 
     alert(position_of_dot); 


     if ($("#fname").val() == null || $("#fname").val() == "") { 
     var err = "First Name"; 
     error_arr.push(err); 
     } 
     if ($("#lname").val() == null || $("#lname").val() == "") { 
     var err = "Last Name "; 
     error_arr.push(err); 
     } 
     if (position_of_at == -1 || position_of_dot == -1 || (position_of_at + 2) >= position_of_dot) { 
     var err = "Email "; 
     error_arr.push(err); 
     } 

     if ($("#dob").val() == null || $("#dob").val() == "") { 
     var err = "Date of Birth "; 
     error_arr.push(err); 
     } 

     if (!$("input[type='radio']").is(":checked")) { 
     var err = "Gender "; 
     error_arr.push(err); 
     } 

     if (!$("input[type='checkbox']").is(":checked")) { 
     var err = "Hobbies "; 
     error_arr.push(err); 
     } 


     alert(error_arr); 

    }); 
    }); 
</script> 
</head> 

<body> 
    <form class="form" name="myForm" action="" method="get"> 
    <table> 
     <tr> 
     <p class="heading">Ragistration Form</p> 
     </tr> 
     <tr> 
     <td class="field_Name">First Name :<b style="color:red">*</b> 
     </td> 
     <td> 
      <input type="text" name="fname" id="fname" class="inputfield_Name" /> 
     </td> 
     </tr> 
     <tr> 
     <td class="field_Name">Last Name :<b style="color:red">*</b> 
     </td> 
     <td> 
      <input type="text" name="lname" id="lname" class="inputfield_Name" /> 
     </td> 
     </tr> 
     <tr> 
     <td class="field_Name">Email :<b style="color:red">*</b> 
     </td> 
     <td> 
      <input type="text" name="email" id="email" class="inputfield_Name" /> 
     </td> 
     </tr> 
     <tr> 
     <td class="field_Name">Date of Birth :<b style="color:red">*</b> 
     </td> 
     <td> 
      <input type="date" name="dob" id="dob" class="inputfield_Name" /> 
     </td> 
     </tr> 
     <tr> 
     <td class="field_Name">Gender :<b style="color:red">*</b> 
     </td> 
     <td> 
      <input type="radio" name="gender" id="mf" class="inputfield_Name" />Male 
      <input type="radio" name="gender" />Female</td> 
     </tr> 
     <tr> 
     <td class="field_Name">About Yourself :</td> 
     <td> 
      <textarea class="inputfield_Name"></textarea> 
     </td> 
     </tr> 
     <tr> 
     <td class="field_Name">Hobbies :<b style="color:red">*</b> 
     </td> 
     <td> 
      <input type="checkbox" id="hobbies" class="inputfield_Name" />Cricket 
      <input type="checkbox" />Singing 
      <input type="checkbox" />Travling</td> 
     <tr> 
      <td></td> 
      <td> 
      <input type="checkbox" class="inputfield_Name" />Writing 
      <input type="checkbox" />Teaching 
      <input type="checkbox" />Driving 
      </td> 
     </tr> 
     <tr> 
      <td> 
      </td> 
      <td> 
      <input type="submit" value="Ragister" name="sbt_save" class="sbt_button" /> 
      </td> 
      </td> 
     </tr> 
    </table> 
    </form> 
</body> 
</html>

Quelle

2016-03-29 Shanky

add 'return false;' innerhalb Ihres Klicks? – theblackgigant

Funktioniert für mich? [https://jsfiddle.net/3of51L6a/] – theblackgigant

wo geschriebene event.preventDefault in Ihrem jsfiddle, ich kann nicht sehen, dass – Shanky

if(error_arr.length){ 
    return false; 
}

am Ende der Klick-Funktion hinzufügen. Die Logik dahinter ist, wenn error_arr leer ist, dann ist das Formular gültig. Wenn es nicht gültig ist, wird es die Bedingung eingeben und das Formular wird nicht übermittelt.

$(document).ready(function(e) 
{   
    $(".sbt_button").click(function(event) 
    {  

     // Rest of your code 
     if(error_arr.length){ 
      event.preventDefault() 
     } 
     alert(error_arr); 

    }); 
});

Quelle

2016-03-29 09:33:42

Nichts verändert es immer noch kommen und geht – Shanky

kann Sie überprüfen meine aktualisierte Antwort mit 'event.preventDefault()' –

Bitte überprüfen Sie die 'console.log (error_arr.length)', wenn Sie einen Fehler haben. Was ist der Wert, den Sie erhalten? –

Alerts nicht zu sehen .. möchte E-Mail-gültig oder nicht überprüfen. Using jQuery

Antwort

Verwandte Themen