我如何使用jQuery驗證插件動畫錯誤標籤

這似乎是一個很簡單的問題，但是我覺得在盯着代碼的時間已經讓我很難找到一個解決方案我如何使用jQuery驗證插件動畫錯誤標籤

我使用的是jQuery Validation plug-in &我想要動畫顯示錯誤標籤。有可能嗎？如果是這樣如何？

我看了一下，但解決方案似乎暗指我！

在此先感謝！

來源

2011-06-27 Sheixt

動畫怎麼/以何種方式？ – nmc

只是爲了改變不透明度，並可能使用幻燈片或緩動選項之一.... – Sheixt

例子：

$("#yourform").validate({ 
rules: { 

Your rules 

}, 
messages:{ 

Your messages 

}, 
errorPlacement: function(error, element){ 
if (element.is(":radio") || element.is(":checkbox")){ 
error.insertAfter(element.parent()).animate({opacity: 0.25, left: '+=50'}); 
} else { 
error.insertAfter(element).animate({opacity: 0.25, left: '+=50'}); 
} 
    } 

});

來源

2011-06-27 20:47:22

AR，你的明星！實現了代碼＆它完美的作品。只需稍作調整即可獲得我之後的風格。真的很驚訝，我自己找不到答案！再次感謝 – Sheixt

現在是否有更普遍接受的方式來執行此操作？此方法有幾個缺點，因爲函數只運行一次，而不是每次驗證字段.... – whiteatom

以前的答案是不完全正確。

對於每個錯誤，errorPlacement函數僅被調用一次。如果你打開和關閉這個錯誤 - jquery.validate調用只是hide和show和highlight和unhighlight。

所以你需要兩個加法：

首先動畫添加到高亮顯示選項：

highlight: function (element, errorClass, validClass) { 
    $(element).parent().find('.help-block') //your error placement 
     .slideDown(300); //animation 
}

其次，如果你想爲隱藏信息動畫，則不能使用「unhighlight」和「效果基本show」，因爲在動畫完成之前，jquery.validate會直接調用'hide'。

因此，你需要重寫標準jquery.validate邏輯：

jQuery.validator.prototype.hideErrors = function() { 
    this.addWrapper(this.toHide).slideUp(300); 
}

來源

2014-03-24 11:43:11

我如何使用jQuery驗證插件動畫錯誤標籤

回答

相關問題