1

完全なajax生成アプリケーションを生成するかなり大きなjavascriptクラスがあります。ajaxページの1つのバージョンには、いくつかのドロップダウンメニューがあります。これらのメニューは、アプリケーションのライフサイクル中のさまざまな時点で作成および破棄される可能性があります。

これは私が見る振る舞いです:

ユーザーがページバージョン1を開きます:ドロップダウンなしユーザーはページバージョン2に移動します:jQueryonchangeイベントで追加されたドロップダウン。意図したとおりに動作します。ユーザーがページのバージョン1に戻り、ドロップダウンが削除されます。ユーザーがページのバージョン2に戻り、ドロップダウンが(同じ要素IDを使用して)再度追加されると、ドロップダウンに「double」イベント処理が追加され、変更ごとにイベントがトリガーされます。

私が苦労している行動は次のとおりです。

最初のページの読み込み時に、onchangeイベントを追加します。

  function myClass(){
       //Initiate once for current and future elements.
   jQuery(document).on('change',".mydropdowns",
   function(e){
        self.submitDescriptionChange(this);
    }
   );
   }

   myClass.prototype.submitDescriptionChange = function (el){
        doSomeAjaxStuff();
   }

これは正常に機能しますが、ユーザーがページバージョン1に移動してページバージョン2に戻るたびに、イベントが乗算されます。非常に迅速に、変更イベントごとに20回イベントが発生する可能性があります。この場合、20回のajax呼び出しが作成されます。

論理的には、jQuery.off()を使用することで、これを回避できるはずです。ただし、代わりに発生するのは、イベントが過去と将来の両方の要素から削除されることです。つまり、ページバージョン2を再作成すると、ドロップダウンが機能しなくなります。

これを試した(そしてLOADSを試した)すべての方法で、イベントが発生しないか、複数のイベントが発生することになります。イベントが一度だけ発生する要素を追加/置換する方法が見つからないようです。

これをどのように解決できるかについてのアイデアはありますか?

更新しました

ええ、それで私は問題を誤診したことがわかりました。これは、実際には、onchangeイベントを再バインドするのではなく、「hashchange」イベントを繰り返し再バインドすることから発生しました。方向を間違えたことをお詫びします。bind()関数を、一度だけ実行される場所に移動すると、問題が修正されました。

4

2 に答える 2

1

ドロップダウンメニューに使用しているプラ​​グインはわかりませんが、そのプラグインには「破棄」メソッドが必要です。動作するはずのドロップダウンを削除するときにそれを呼び出す場合。また、2番目のページのみを非表示にして、実際にDOMから削除していない場合は、プラグインが要素に保存されたままになるため、プラグインを再度呼び出す必要はありません。

于 2012-08-27T17:49:42.567 に答える
1

.off()で他のページからイベントを削除したくないので、イベントに名前名を使用することをお勧めします。たとえば、次のようなものです。

function myClass(pageno) {
    var pref_ev = 'mypage' + pageno + '.' + 'change';
    $(document).off(pref_ev).on(pref_ev, ".mydropdowns", function(e) {
        self.submitDescriptionChange(this);
    });
}

このように、各ページには「mypage1.change」などの独自の「change」イベントがあります。イベントは引き続き通常どおり変更イベントとして登録されます。プレフィックス名前空間"mypage1"は、適切なイベントで.off()呼び出しのみを実行するために使用されます。

于 2012-08-27T17:57:48.093 に答える