2012-03-14 128 views
1

新手在這裏。我需要一些幫助。默認字段值的Javascript驗證

我正在爲我的網站使用預先編寫的JavaScript表單驗證程序,但事實是,它不是爲默認值爲的字段而設計的。所以問題是驗證者正在考慮值「名稱」和「消息」是有效的,並且消息沒有任何錯誤消息。

我做了一些研究,看到一些建議,但在JavaScript中知識很少,我不知道如何實現它們或如何創建另一組驗證規則。

通過我使用無接觸形式從方式[http://www.faridhadi.com/][1]

下面是劇本我的工作:

我希望你們可以幫我!謝謝!

// JavaScript Document 

$(document).ready(function() { 

    $('#contactForm #submit').click(function() { 
     // Fade in the progress bar 
     $('#contactForm #formProgress').hide(); 
     $('#contactForm #formProgress').html('<img src="images/ajax-loader.gif" /> Sending&hellip;'); 
     $('#contactForm #formProgress').fadeIn(); 

     // Disable the submit button 
     $('#contactForm #submit').attr("disabled", "disabled"); 

     // Clear and hide any error messages 
     $('#contactForm .formError').html(''); 

     // Set temaprary variables for the script 
     var isFocus=0; 
     var isError=0; 

     // Get the data from the form 
     var name=$('#contactForm #name').val(); 
     var email=$('#contactForm #email').val(); 
     var subject=$('#contactForm #subject').val(); 
     var message=$('#contactForm #message').val(); 

     // Validate the data 
     if(name=='') { 
      $('#contactForm #errorName').html('This is a required field.'); 
      $('#contactForm #name').focus(); 
      isFocus=1; 
      isError=1; 
     } 
     if(email=='') { 
      $('#contactForm #errorEmail').html('This is a required field.'); 
      if(isFocus==0) { 
       $('#contactForm #email').focus(); 
       isFocus=1; 
      } 
      isError=1; 
     } else { 
      var reg = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/; 
      if(reg.test(email)==false) { 
       $('#contactForm #errorEmail').html('Invalid email address.'); 
       if(isFocus==0) { 
        $('#contactForm #email').focus(); 
        isFocus=1; 
       } 
       isError=1; 
      } 
     } 
     if(message=='') { 
      $('#contactForm #errorMessage').html('This is a required field.'); 
      if(isFocus==0) { 
       $('#contactForm #message').focus(); 
       isFocus=1; 
      } 
      isError=1; 
     } 

     // Terminate the script if an error is found 
     if(isError==1) { 
      $('#contactForm #formProgress').html(''); 
      $('#contactForm #formProgress').hide(); 

      // Activate the submit button 
      $('#contactForm #submit').attr("disabled", ""); 

      return false; 
     } 

     $.ajaxSetup ({ 
      cache: false 
     }); 

     var dataString = 'name='+ name + '&email=' + email + '&subject=' + subject + '&message=' + message; 
     $.ajax({ 
      type: "POST", 
      url: "php/submit-form-ajax.php", 
      data: dataString, 
      success: function(msg) { 

       //alert(msg); 

       // Check to see if the mail was successfully sent 
       if(msg=='Mail sent') { 
        // Update the progress bar 
        $('#contactForm #formProgress').html('<img src="images/ajax-complete.gif" /> Message sent.').delay(2000).fadeOut(400); 

        // Clear the subject field and message textbox 
        $('#contactForm #subject').val(''); 
        $('#contactForm #message').val(''); 
       } else { 
        $('#contactForm #formProgress').html(''); 
        alert('There was an error sending your email. Please try again.'); 
       } 

       // Activate the submit button 
       $('#contactForm #submit').attr("disabled", ""); 
      }, 
      error: function(ob,errStr) { 
       $('#contactForm #formProgress').html(''); 
       alert('There was an error sending your email. Please try again.'); 

       // Activate the submit button 
       $('#contactForm #submit').attr("disabled", ""); 
      } 
     }); 

     return false; 
    }); 
}); 

回答

0

您最好使用HTML5 placeholder屬性作爲「默認值」。爲了支持所有瀏覽器,您可以使用jQuery watermark多邊形填充舊瀏覽器以支持placeholder的插件。

爲了驗證它也最好使用廣泛使用jQuery Validator插件

0

如果在默認情況下你指的是初始value="No Subject"可以修改分配變量佔該值如果輸入是空的;

var name = $('#contactForm #name'); 
name = $.trim(name.val()) || name.prop("defaultValue"); 
... 
var email = ....