1

私が取り組んでいるコードは、別のページにいくつかのメッセージを表示します。

pageはページ番号です。

ActionGetMessagesは ajax リクエストです。

PushMessageはコンテンツを管理するだけです。

コードは次のとおりです。

function ShowMessages ( page ) {
    
    var oMessages = ActionGetMessages ( page );

    for ( var key in oMessages ) {
        if ( key == "end" ) continue;
        PushMessage ( oMessages [key] );
    }

    var previous_page_button = document.getElementById ( "previous_page_button");
    var next_page_button = document.getElementById ( "next_page_button" );

    if ( page > 0 ) {
        previous_page_button.style.display = "block";
        previous_page_button.addEventListener ( "click",
                                                    function () {
                                                        ShowMessages ( page - 1 );
                                                    } );
    }

    if ( !oMessages ["end"] ) {
        next_page_button.style.display = "block";
        next_page_button.addEventListener ( "click",
                                                    function () {
                                                        ShowMessages ( page + 1 );
                                                    } );
    }
}

このコードをデバッグすると、ユーザーがページを前後に移動した後、(たとえば) 次のページ ボタンをクリックすると、複数の呼び出しが発生することがわかりましShowMessagesた。

どんな助けでも本当に感謝しています。

4

1 に答える 1

1

上記のコードで何をしているのかは完全にはわかりませんが、あなたが説明したことは、必要のないイベントリスナーが複数回接続されているように思えます。

実際、それを呼び出すボタンをクリックすると、ボタンがクリックされるたびにShowMessages()別のイベントリスナーがボタンにアタッチされます。したがって、イベントをアタッチする前に、まず既存のリスナーを削除してみてください。見て:

removeEventListener

イベントリスナーを追加する前にボタンにイベントが関連付けられていないことを確認すると、ボタンは機能し、コードは 1 回だけ実行されます。

リスナーを削除するには、リスナーへの参照が必要になることに注意してください。次のように実行できます。

//Define this listener globally (anywhere outside your function) 
// so you can reference it anytime or keep track of the last
// added listener somewhere. Otherwise you won't be able to
// remove it.
var myPreviousPageListener = function () {
                             ShowMessages ( page - 1 );
                         } 

previous_page_button.removeEventListener("click", myPreviousPageListener);
previous_page_button.addEventListener ( "click", myPreviousPageListener);
于 2013-08-06T12:22:59.130 に答える