現在、jquery validate 1.8.1 を使用しており、ターゲット ブラウザーは IE7 です。メイン ページにフォームがあり、フォーム要素は AJAX を介して動的に挿入されます。フォーム内の要素を管理するドロップダウン ボックスがあり、このドロップダウン ボックスで選択された内容に応じて、フォームは異なるコンテンツを送信します。
$('some_pane').load('/remote_location.html', ...);
したがって、jquery 検証を動的にインスタンス化する必要があります。
var myValidator;
myValidator = $('#myForm').validate();
myValidator.settings.submitHandler = myFormSubmitHandler;
$('#input1inMyForm').rules('add', .....)
ページの読み込み時に初めて動的に読み込まれるとき、およびフォームの送信時に myFormSubmitHandler が正確に 1 回呼び出されるときは、すべて問題ありません。
ただし、ユーザーがドロップダウン ボックスで別の値を選択すると、フォームに別の要素セットが動的に挿入され、新しいバリデータがインスタンス化されると、問題が発生します。
新しいバリデータをインスタンス化する前に適切なクリーンアップを行い、Firefox と Chrome で動作します
$('#myForm').data('validator', null);
$('#myForm').unbind('submit');
私は StackOverflow で広範な検索を行いましたが、実用的な解決策を思いつくことはできませんでしたが、IE と jQuery に関するいくつかの重要なポイントを要約することができました
- jQuery.bind でバインドされているイベントのみバインド解除できます
- IE のイベントは events プロパティに格納されており、以前の onsubmit イベントを削除できなかったことがわかります。新しいバリデータをインスタンス化するたびに、追加の onsubmit イベントがフォームに添付されています。
これらは私が試したクリーンアップですが、IE7 では動作しません。
$('#myForm').removeAttr('onsubmit');
if( document.detachEvent ) {
document.getElementById('myForm').detachEvent('onsubmit', myFormSubmitHandler);
}
とても有難い。