jQuery驗證和提示不能在IE中選擇使用

我使用jQuery Validation插件來驗證我的表單並使用Tipsy工具提示來獲取錯誤消息。我在IE 10/11的下拉菜單中遇到問題。jQuery驗證和提示不能在IE中選擇使用

確認後，如果該字段報告了所需的消息，則下拉列表會自動打開和關閉，而不會讓您有機會選擇該字段。

$('[id^="form-"] :input').tipsy({ 
     trigger: 'manual', 
     fade: true, 
     gravity: 'e', 
     className: 'tip-blue' 
    }); 


    $("#form-account").validate({ 
    ... 
    errorPlacement: function (error, element) 
    { 
     element.attr('title', error.text()); 
     element.tipsy('show'); 
    },

我該如何解決？

JSFIDDLE

來源

2014-11-24 Paolo Rossi

整合與jQuery驗證插件一個jQuery插件，提示可能是一個非常複雜的任務，取決於雙方的插件提供的方法。所以你將不得不花更多的精力來編寫你的問題......比如包括一個更完整的演示以及相關的HTML和'.validate（）'方法中的其他內容。同時，[看看這個問題]（http://stackoverflow.com/a/14741689/594235）看看我在說什麼。 – Sparky 2014-11-24 16:25:43

由於jQuery旨在將這些行爲規範化以適用於包括IE 10/11在內的所有瀏覽器，因此您將不得不檢查HTML結構。我懷疑你的瀏覽器無法處理無效的HTML。 – Sparky 2014-11-24 16:31:17

@Sparky - HTML代碼不報告錯誤（與螢火蟲和IE控制檯）。我讀過一篇文章，有人說「看起來IE不喜歡選擇的標題屬性」。 – 2014-11-24 16:41:25

報價OP：

場報告所要求的消息

這整個問題與每當您如何IE被觸發的事件做一個選擇。在其他瀏覽器中，僅僅選擇一個新選項會立即觸發重新驗證。但是，在資源管理器中，只有在完全脫離select字段之後，纔會觸發重新驗證。

解決方法是手動捕獲change事件並使用插件的.valid()方法強制重新驗證。

$('[name="user"]').on('change', function() { 
    $(this).valid(); 
});

DEMO：http://jsfiddle.net/d7apuegL/

報價OP：

下拉打開並自動關閉

這是因爲每次更改其title屬性時，IE都會重新呈現激活的select元素;並且您的errorPlacement函數在您嘗試進行選擇時正在更改title。

這並不完美，但唯一的解決方法似乎是將自定義錯誤消息移動到select的title屬性中。

HTML：

<select name="user" id="test" title="error">

的jQuery：

errorPlacement: function (error, element) { 
    // element.attr('title', error.text()); // remove this 
    element.tipsy('show'); 
},

DEMO：http://jsfiddle.net/d7apuegL/1/

只要您的解決方案取決於動態變化而的title屬性被激活，你總是會遇到某種形式的這個問題。這只是IE的工作原理，所以最好完全打破你對title屬性的依賴，或完全使用不同的工具提示插件。

參見：How to display messages from jQuery Validate plugin inside of Tooltipster tooltips?

DEMO：http://jsfiddle.net/2012j6dv/

來源

2014-11-24 17:31:23 Sparky

第二個選項似乎解決了我的問題，但我意識到，我選擇了該領域，並嘗試再次選擇它的問題（自動關閉）仍然發生..謝謝你的幫助！ – 2014-11-24 18:19:43

@PaoloRossi，我說這不是完美的，只要你在選擇被激活時依賴於改變'title'屬性，你總會遇到某種形式的問題。我會完全打破對'title'屬性的依賴，並在必要時使用不同的工具提示插件。 – Sparky 2014-11-24 18:37:09

非常感謝您的幫助以及您專注於我的問題的時間。我想問您，如果您知道一個工具提示插件，可以讓我解決這個問題。再次感謝 – 2014-11-24 18:42:51

jQuery驗證和提示不能在IE中選擇使用

回答

相關問題