Basit bir jQuery form doğrulama komut dosyası

Question

jQuery'yi kullanarak basit bir doğrulama formu hazırladım. İyi çalışıyor. Şey, kodumdan memnun değilim. Kodumu aynı çıktı sonucuna yazmanın başka bir yolu var mı?

$(document).ready(function(){ 

$('.submit').click(function(){ 
    validateForm(); 
}); 

function validateForm(){ 

    var nameReg = /^[A-Za-z]+$/; 
    var numberReg = /^[0-9]+$/; 
    var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/; 

    var names = $('#nameInput').val(); 
    var company = $('#companyInput').val(); 
    var email = $('#emailInput').val(); 
    var telephone = $('#telInput').val(); 
    var message = $('#messageInput').val(); 

    var inputVal = new Array(names, company, email, telephone, message); 

    var inputMessage = new Array("name", "company", "email address", "telephone number", "message"); 

    $('.error').hide(); 

     if(inputVal[0] == ""){ 
      $('#nameLabel').after('<span class="error"> Please enter your ' + inputMessage[0] + '</span>'); 
     } 
     else if(!nameReg.test(names)){ 
      $('#nameLabel').after('<span class="error"> Letters only</span>'); 
     } 

     if(inputVal[1] == ""){ 
      $('#companyLabel').after('<span class="error"> Please enter your ' + inputMessage[1] + '</span>'); 
     } 

     if(inputVal[2] == ""){ 
      $('#emailLabel').after('<span class="error"> Please enter your ' + inputMessage[2] + '</span>'); 
     } 
     else if(!emailReg.test(email)){ 
      $('#emailLabel').after('<span class="error"> Please enter a valid email address</span>'); 
     } 

     if(inputVal[3] == ""){ 
      $('#telephoneLabel').after('<span class="error"> Please enter your ' + inputMessage[3] + '</span>'); 
     } 
     else if(!numberReg.test(telephone)){ 
      $('#telephoneLabel').after('<span class="error"> Numbers only</span>'); 
     } 

     if(inputVal[4] == ""){ 
      $('#messageLabel').after('<span class="error"> Please enter your ' + inputMessage[4] + '</span>'); 
     }  
} 

}); 

Answer 1

için email : true tanımlayabilirsiniz e-posta için daha pek çok özellik vardır aynı required : true görebiliriz.

jQuery:

$(document).ready(function() { 

    $('#myform').validate({ // initialize the plugin 
     rules: { 
      field1: { 
       required: true, 
       email: true 
      }, 
      field2: { 
       required: true, 
       minlength: 5 
      } 
     } 
    }); 

}); 

HTML:

<form id="myform"> 
    <input type="text" name="field1" /> 
    <input type="text" name="field2" /> 
    <input type="submit" /> 
</form> 

DEMO: http://jsfiddle.net/xs5vrrso/

Seçenekler:http://jqueryvalidation.org/validate

Yöntem:http://jqueryvalidation.org/category/plugin/

Standart Kurallar: http://jqueryvalidation.org/category/methods/additional-methods.js file ile

Opsiyonel Kurallar kullanılabilir: bunu yapmak için

maxWords 
minWords 
rangeWords 
letterswithbasicpunc 
alphanumeric 
lettersonly 
nowhitespace 
ziprange 
zipcodeUS 
integer 
vinUS 
dateITA 
dateNL 
time 
time12h 
phoneUS 
phoneUK 
mobileUK 
phonesUK 
postcodeUK 
strippedminlength 
email2 (optional TLD) 
url2 (optional TLD) 
creditcardtypes 
ipv4 
ipv6 
pattern 
require_from_group 
skip_or_fill_minimum 
accept 
extension 

Answer 2

bunun için jQuery doğrulayıcı kullanabilirsiniz ama bunun için jquery.validate.js ve jquery.form.js dosya eklemek gerekir. validator dosyasını ekledikten sonra, doğrulama işleminizi böyle bir şekilde tanımlayın.

<script type="text/javascript"> 
$(document).ready(function(){ 
    $("#formID").validate({ 
    rules :{ 
     "data[User][name]" : { 
      required : true 
     } 
    }, 
    messages :{ 
     "data[User][name]" : { 
      required : 'Enter username' 
     } 
    } 
    }); 
}); 
</script> 

Sen aşağıdaki gibi basitçe the jQuery Validate plugin kullanabilirsiniz sayı number : true