2015-11-24 3 views
0

Мне нужно проверить динамически созданные текстовые поля, здесь я создал три текстовых поля, тогда функция карты проверяет все три текстовых поля, но если проверка является ложной, время и страница будут отправлены. я хочу, если проверка ложно остановить submit.help меня ...Как проверить динамические текстовые поля с помощью jquery

//email.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
    <html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
    <title>Settings</title> 
    <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/ui-lightness/jquery-ui.css" /> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js">    </script> 
    <style> 
    p { 
     font-size:12px; 
     color:red; 
     } 
    </style> 
    <script type="text/javascript"> 
    $(document).ready(function(){ 
    $('#submit').click(function(e){ 
     i = 0; 
     $('input[name="email[]"]').map(function(){ 
     console.log(i++); 
     email = $(this).val(); 
     console.log(email); 

     if(validateEmail(email) === false) 
     { 
      alert('Invalid email-id'); 
      //$('#p2').html("Please Enter a Email-id"); 
      return false; 
     } 
     return false; 
    }); 

    }); 
    }); 
    </script> 
    <script type="text/javascript"> 
     function validateEmail(email) { 
      var re = /^(([^<>()[\]\\.,;:\[email protected]\"]+(\.[^<>()[\]\\.,;:\[email protected]\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/; 
      return re.test(email); 
     } 
     </script> 
     </head> 
     <body> 
      <form name="form" id="fakkir" action="#" method="post"> 
      <input type="text" name="email[]" id="email1"/></br> 
      <p id="p2"></p> 
      <input type="text" name="email[]" id="email2"/></br> 
      <p id="p3"></p> 
      <input type="text" name="email[]" id="email3" /></br> 
      <p id="p4"></p> 

      <input type="submit" name="submit" id="submit" value="submit" /> 
      </form> 
     </body> 
     </html> 

ответ

0

Здесь отредактирован js script. Поместите свой validateEmail внутри функции ready. Я использовал submit событие.

$(document).ready(function(){ 
    $('#fakkir').on("submit",function(e){ 
    //$('input[name="email[]"]').each(function(){ 
    //$('input[name="email[]"]').click(function() { 
    i = 0; 
     var isValid = true; 
    $('input[name="email[]"]').map(function(){ 
    console.log(i++); 
    email = $(this).val(); 
     console.log(email); 
    //alert($(this).val()); 

    if(validateEmail(email) === false) 
     { 
      isValid = false; 
     alert('Invalid email-id'); 
      //$('#p2').html("Please Enter a Email-id"); 
      return false; 
     } 
     return false; 
    }); 
     if(isValid){   
      return true; 
     }else{ 
      return false; 
     } 

     }); 
    function validateEmail(email) { 
      var re = /^(([^<>()[\]\\.,;:\[email protected]\"]+(\.[^<>()[\]\\.,;:\[email protected]\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/; 
      return re.test(email); 
     } 
    }); 

Вот JsFiddle

+0

hai karan спасибо ,,,,, но все же форма отправлена ​​.... мне нужно, если пользователь вводит неверный или пустой идентификатор электронной почты ... –

+0

Я сделал редактирование. Проверьте новый код и скрипку – Karan

+0

, пожалуйста, подождите, я проверю ... –

0

Использование

e.preventDefault(); 

перед возвращением ложной.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Settings</title> 
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/ui-lightness/jquery-ui.css" /> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script> 
<style> 
p { 
    font-size:12px; 
     color:red; 
     } 
</style> 
    <script type="text/javascript"> 
    $(document).ready(function(){ 
    $('#submit').click(function(e){ 
    //$('input[name="email[]"]').each(function(){ 
    //$('input[name="email[]"]').click(function() { 
    i = 0; 
    $('input[name="email[]"]').map(function(){ 
    console.log(i++); 
    email = $(this).val(); 
     console.log(email); 
    //alert($(this).val()); 

    if(validateEmail(email) === false) 
     { 
     alert('Invalid email-id'); 
      //$('#p2').html("Please Enter a Email-id"); 
      e.preventDefault(); 
      return false; 
     } 
     e.preventDefault(); 
     return false; 
    }); 
     /* 
      i = 0; 
     $('input[name="email[]"]').each(function(){ 
      console.log(i++); 
      console.log('welcome'); 
      email = $('input[name="email[]"]').val(); 
      console.log(email); 
      alert($(this).val()); 
      /*var reg = /^([a-zA-Z0-9_\.\-]+\@(([a-zA-Z0-9\-])+\.)+[a-zA-Z0-9]{2,4})+$/; 

       if(email==""){ 
       $('#p2').html("Please Enter a Email-id"); 
       $('input[name="email[]"]').focus(); 

       return false; 
       } 
      else if(!email.match(reg)){ 
       $('#p2').html("Please Enter a Valid Email-id"); 
       $('input[name="email[]"]').focus(); 
       return false; 
       }*/ 
      //});*/ 
     //}); 
     }); 
    }); 
    </script> 
    <script type="text/javascript"> 
    /*function validate(email){ 
    var reg = /^([a-zA-Z0-9_\.\-]+\@(([a-zA-Z0-9\-])+\.)+[a-zA-Z0-9]{2,4})+$/; 
    if(email==""){ 
      return false; 
     } 
     else if(!email.match(reg)){ 
       return false; 
       }else{ 
       return true; 
       } 
     }*/ 

      function validateEmail(email) { 
      var re = /^(([^<>()[\]\\.,;:\[email protected]\"]+(\.[^<>()[\]\\.,;:\[email protected]\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/; 
      return re.test(email); 
     } 
      </script> 
     </head> 
      <body> 
      <form name="form" id="fakkir" action="#" method="post"> 
      <input type="text" name="email[]" id="email1"/></br> 
      <p id="p2"></p> 
      <input type="text" name="email[]" id="email2"/></br> 
     <p id="p3"></p> 
     <input type="text" name="email[]" id="email3" /></br> 
     <p id="p4"></p> 

     <input type="submit" name="submit" id="submit" value="submit" /> 
      </form> 
      </body> 
      </html> 
+0

хаи Санджай ... снова форма отправлена ​​... –

+0

No. Его работы составляют меня. Можете ли вы проверить эти скрипты? С моим кодом: http://phpfiddle.org/main/code/1a5v-779z С вашим кодом: http://phpfiddle.org/main/code/1a5v-779z - здесь вы можете увидеть веб-сайт перезагружается в результате отправки. –

+0

, пожалуйста, подождите, я проверяю ... –

0

попробовать:

<script type="text/javascript"> 
    $(document).ready(function(){ 
    $('#submit').on('click',function(e){ 

    i = 0; 
     var v = 0; 
    $('input[name="email[]"]').map(function(){ 

    email = $(this).val(); 


    if(validateEmail(email) === false) 
     { 
      v=1; 
     alert('Invalid email-id'); 
      e.preventDefault(); 

     } 

    }); 
     console.log(v); 
     if (v == 0) { 
      alert('valid') 
      $('#fakkir').submit(); 
     } 
     }); 
    }); 
     function validateEmail(email) { 
      var re = /^(([^<>()[\]\\.,;:\[email protected]\"]+(\.[^<>()[\]\\.,;:\[email protected]\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/; 
      return re.test(email); 
     } 
    </script>