2

作業中のWebページでリソースリークを発見しました。

このWebページには2つのテキストフィールドがあり、クリックするとモーダルダイアログが表示され、バックエンドへのデータリクエストが実行され、ユーザーが最初にクリックしたテキストボックスで使用するエントリを選択できるテーブルにその情報が表示されます。

クリックイベントを次のようにテキストボックスにバインドしています。

var $field = $('#one-of-the-text-fields');

$field.click(function () {
        App.DialogClass.show();
        App.DialogClass.PopulateTable();
        App.DialogClass.GotoPageButtonAction(actionArgs);  // Offender!
});

...どの呼び出し...

App.DialogClass = (function($) {

var pub {},
    $gotoPage = $('#pageNumberNavigationField'),
    $gotoPageButton = $('#pageNumberNavigationButton');

// ...SNIP unimportant other details...

pub.GotoPageButtonAction = function (args) {
    $gotoPageButton.click(function () {
        var pageNumber = $gotoPage.val();
        pub.PopulateTable(args);   // Breakpoint inserted here...
    });
};

return pub;

})(jQuery);

ChromeのJavaScriptデバッガーを使用して実行したときに、別のボタンをクリックするたびに常に1つの追加のブレークポイントがヒットするため（たとえば、フィールドAを初めてクリックしたときに、ブレークポイントが2回ヒットします。フィールドをヒットすると、リークに気づきました。その後B、ブレークポイントが3回ヒットします。その後Aをクリックすると、ブレークポイントが4回ヒットします。必要に応じて外挿します。）

コードのどこにも、特定のフィールドの既存のクリックイベントについて何もしていません。私のリークは、イベントがクリーンアップされていないという事実に起因しているのではないかと思います。そうは言っても、私はJavaScript/jQueryにあまり精通していません。コントロールからクリックイベントを削除するためのいくつかのテクニックは何ですか？

4

3 に答える 3

5

もちろん。それらをアンバインドするだけです：

$field.unbind('click');

ただし、これにより、自分のイベント ハンドラーだけでなく、クリックのすべてのイベント ハンドラーが削除されることに注意してください。安全のために、ハンドラーをバインドするときは名前空間を使用する必要があります。

$field.bind('click.mynamespace', function(){
    // do something
});

それで、

$field.unbind('click.mynamespace');

そのため、ハンドラーのみが削除されます。

于 2012-09-27T16:30:11.330 に答える
4

それらをバインドするために.bind()を使用した場合、.unbind()はイベントを削除します

.on()を使用してそれらをバインドした場合、.off()はイベントを削除します

于 2012-09-27T16:36:01.667 に答える
1

JQuery は、イベント リスナーのバインドを解除するunbind関数を提供します。

removeEventListenerを使用してバニラ JS でも実行できることに注意してください。

しかし、バインドを解除する代わりに、おそらく毎回バインドするべきではありませんGotoPageButtonAction: 1 回で十分です。

于 2012-09-27T16:28:22.450 に答える