JQuery驗證器＆qTip2 - 成功後不會隱藏

Question

我一直在努力與兩個庫一起工作，現在差不多完成了！

起初，我嘗試了正常，建議道：

1. 通過escaped name attributes創建表單
2. 設置驗證規則，如RoR自動設定所有形式的名稱，屬性是這樣的：user[name]。

這是行不通的，因爲我不知道爲什麼。 JavaScript根本不會識別帶有方括號的屬性"user[name]"。

然後我嘗試了另一種方式並動態添加規則。這是一個代碼段我的驗證看起來像現在：

表：

<form id="form" action="#"> 
    <input type="text" name="user[username]" /> 
    <input type="submit" /> 
</form> 

的JavaScript：

$(function() { 

    $("input[name='user[username]']").rules("add", { 
     required: true, 
     minlength: 3, 
     maxlength: 20, 
     messages: { 
     required: "U better fill dis out!", 
     minlength: "Hey, minimum of 3 letters!", 
     maxlength: "U wanna fuck wis me? I no can read dat much!" 
     } 
    }) 

    $('#form').validate({ 
     debug: true, 
     validClass: 'valid', 
     errorClass: 'error', 
     errorPlacement: function(error, element) { 

     // qTip call 
     if (!$(element).hasClass('valid')) { 
      if (error.html() != "") { 
      $(element).qtip({ 
       content: { 
       text: error.html() 
       }, 
       position: { 
       my: 'left center', 
       at: 'right center', 
       target: $(element) 
       }, 
       show: { 
       when: false, 
       ready: true 
       }, 
       hide: false 
      }); 
      } 
     } 
     }, 
     success: function(label, element) { 
     // Hide tooltips on valid elements 
     $(element).not('.error').qtip('hide'); 
     }, 
     highlight: function(element, errorClass, validClass) { 
     $(element).addClass(errorClass).removeClass(validClass); 
     }, 
     unhighlight: function(element, errorClass, validClass) { 
     $(element).addClass(validClass).removeClass(errorClass); 
     } 
    }); 

}); 

現在想象以下場景：

1. 我在寫東西這個文本字段，就像只有1個字母
2. qTip顯示我的驗證消息告訴我：「最少需要3個字母。「
3. 現在我要解決這個問題，輸入4個字母。所有的驗證現在應該通過。
4. 當我移動和點擊輸入框外，該qTip就會消失。
5. 當我點擊裏面輸入字段再次顯示，舊的qTip將再次顯示，說「最少需要3個字母。」但裏面有4個字母爲什麼它仍然顯示編輯

：？

這是HTML輸出，後Step 5

<input aria-describedby="qtip-22" data-hasqtip="22" class="valid" name="user[username]" type="text"> 

Answer 1

解決

好吧，現在我感覺超級啞巴，同時也像國王一樣。

該解決方案非常簡單。而不是隱藏qTip，只需在驗證成功時將其刪除即可。

... 
success: function(label, element) { 
    // Destroy tooltips on valid elements 
    $(element).not('.error').qtip('destroy'); 
} 
...