2012-02-24 59 views
3

我有一個ajax函數,其中用戶輸入的東西和建議顯示在下拉列表中。 我的問題是我使用jQuery驗證,並且當用戶點擊一個建議時,解決方法是作爲一個onlur等,並沒有得到用戶點擊的價值。jQuery驗證刪除一個字段上的模糊

我試圖通過取消對一個領域的onblur功能:

$('#customerExist').bind('blur',function(){ 
      return true; 
    }); 

但這不工作。我想在ajax-suggestion旁邊的所有字段上使用onblur驗證。

最好的解決方案是在所有字段上進行onblur驗證,但是如果我所做的驗證方法可能會變暗1秒。然後取得輸入字段的值。

我知道我可以使用onfocusout: false,但我會盡量避免這種情況。

這是驗證方法:

jQuery.validator.addMethod("customerExist", function(value, element, param) { 
if (this.optional(element)) 
    return "dependency-mismatch"; 

var previous = this.previousValue(element); 
if (!this.settings.messages[element.name]) 
    this.settings.messages[element.name] = {}; 
previous.originalMessage = this.settings.messages[element.name].remote; 
this.settings.messages[element.name].remote = previous.message; 

param = typeof param == "string" && {url:param} || param; 

if (this.pending[element.name]) { 
    return "pending"; 
} 
if (previous.old === value) { 
    return previous.valid; 
} 

previous.old = value; 
var validator = this; 
this.startRequest(element); 
var data = {}; 
data["customer"] = encodeURIComponent(value); 
$.ajax($.extend(true, { 
    url: www+"validation.jsp", 
    dataType: "json", 
    data: data, 
    success: function(response) { 
     validator.settings.messages[element.name].remote = "This customer do not exist";//previous.originalMessage; 
     var valid = response === true; 
     if (valid) { 
      var submitted = validator.formSubmitted; 
      validator.prepareElement(element); 
      validator.formSubmitted = submitted; 
      validator.successList.push(element); 
      validator.showErrors(); 
     } else { 
      var errors = {}; 
      var message = response || validator.defaultMessage(element, "remote"); 
      errors[element.name] = previous.message = $.isFunction(message) ? message(value) : message; 
      validator.showErrors(errors); 
     } 
     previous.valid = valid; 
     validator.stopRequest(element, valid); 
    } 
}, param)); 
return "pending"; 
    }, ""); 

回答

2

您可以提供一個功能onfocusout在參數。 例如,如果要取消驗證的具體內容:

$('#filterForm').validate(
    {   
     onfocusout:function (element) { 
      if (!$(element).is('.customerExist')) { 
       if (!this.checkable(element) && (element.name in this.submitted || !this.optional(element))) { 
        this.element(element); 
       } 
      } 
     } 
    }); 

如果你想延遲驗證,可以嘗試以下方法:

$('#filterForm').validate(
    { 
     onfocusout:function (element) { 
      var me = this; 
      var delayedValidation = function() { 
       me.element(element); 
      }; 
      if (!this.checkable(element) && (element.name in this.submitted || !this.optional(element))) { 
       if ($(element).is('.customerExist')) { 
        setTimeout(delayedValidation, 200); 
       } else { 
        this.element(element); 
       } 
      } 
     } 
    }); 
1

我建議類似的方法@Kipriz,除了你應該檢查元素上的類而不是直接引用元素。

// suppresses on-focusout validation of fields marked 'no-validate-on-focusout' 
// validation still occurs on attempting to submit the form 
(function() { 
    var oldonfocusout = $.validator.defaults.onfocusout; 
    $.validator.setDefaults({ 
     onfocusout: function (element) { 
      if ($(element).hasClass('no-validate-on-focusout')) { 
       return; 
      } 
      oldonfocusout.call(this, element); 
     } 
    }); 
}()) 

然後,您可以輕鬆地使任何元素在模糊上表現出相同的行爲,只需添加類即可。

<input class="no-validate-on-focusout" type="input" />