2011-02-16 40 views
0

我有一個表單驗證用戶輸入。當用戶單擊提交按鈕並且一個或多個必填字段爲空時,字段或標籤右側會顯示「必需」消息,頂部和底部會顯示一條常規消息。這似乎工作正常。但是,當我通過更新其中一個空的必填字段來測試表單時,即使其他必填字段保留空白,一般消息也會消失。我怎樣才能防止這一點?我很感激任何幫助。謝謝 - DJH如何防止JavaScript錯誤消息在多次更正後首先隱藏?

$(document).ready(function() { 
$('form').submit(function(event){ 

var isErrorFree = true; 

$('input.required, select.required, textarea.required',this).each(function(){ 
    if (validateElement.isValid(this) == false){ 
     isErrorFree = false; 
    }; 
}); 

return isErrorFree; 
return getFocus; 

}); // close .submit() 

var validateElement = { 

    isValid:function(element){ 

     var isValid = true; 
     var $element = $(element); 
     var id = $element.attr('id'); 
     var name = $element.attr('name'); 
     var value = $element.val(); 
     var hideMsg = true; 

     // <input> uses type attribute as written in tag 
     // <textarea> has intrinsic type of 'textarea' 
     // <select> has intrinsic type of 'select-one' or 'select-multiple' 
     var type = $element[0].type.toLowerCase(); 

     switch(type){ 
      case 'text': 
      case 'textarea': 
      case 'password': 
       if (value.length == 0 || 
value.replace(/\s/g,'').length == 0){ isValid = false; hideMsg = false; } 
       break; 
      case 'select-one': 
      case 'select-multiple': 
       if(!value){ isValid = false; hideMsg = false; } 
       break; 
      case 'checkbox': 
      case 'radio': 
       if($('input[name="' + name + 
'"]:checked').length == 0){ isValid = false; hideMsg = false; }; 
       break; 
     } // close switch() 

     var method = isValid ? 'removeClass' : 'addClass'; 
     var msgStat = hideMsg ? 'removeClass' : 'addClass'; 


     if (type == 'checkbox' || type == 'radio') { 
      // if radio button or checkbox, find all inputs with the same name 
      $('input[name="' + name + '"]').each(function(){ 
       // update each input elements <label> tag, (this==<input>) 
       $('#errorMessage_' + name)[method]('showErrorMessage'); 
       $('#errorMessage1')[msgStat]('showErrorMessage'); 
       $('#errorMessage2')[msgStat]('showErrorMessage'); 
      }); 

     } else { 

      // all other elements just update one <label> 
      $('#errorMessage_' + name)[method]('showErrorMessage'); 
      $('#errorMessage1')[msgStat]('showErrorMessage'); 
      $('#errorMessage2')[msgStat]('showErrorMessage'); 
    } 
     // $('#errorMessage1')[msgStat]('showErrorMessage'); 
     // $('#errorMessage2')[msgStat]('showErrorMessage'); 
    // after initial validation, allow elements to re-validate on change 
    $element 
     .unbind('change.isValid') 
     .bind('change.isValid',function(){ validateElement.isValid(this); }); 

     return isValid; 


// close validateElement.isValid() 

// close validateElement object 

// close ready object 

回答

0

您是否需要專門編寫自己的驗證腳本?

看來很多你的是覆蓋在jQuery的驗證插件測試什麼的 - http://docs.jquery.com/Plugins/Validation

可能使生活更輕鬆

+0

我會再看看。謝謝。 – Don 2011-02-16 14:59:18