0

ajaxPoll チャット システムに問題があります。チャット メッセージの最後の ID を に返信しようとしてdivいますphp。そのため、クエリは最後に送信された ID よりも大きい結果のみを表示できます。

すべてのチャット メッセージは、div呼び出されchat_logた . メッセージにはdiv、メッセージの ID のクラスを含む があります。テキストのmessage後にそのメッセージの ID が続きます (例: class="message543". 分かりやすくするために、構造と正しい順序で HTML のサンプルを示します。

<div id='chat_log'>
    <div class='message435'></div>
    <div class='message436'></div>
    <div class='message437'></div>
    <div class='message438'></div>
    <div class='message439'></div>
    <div class='message440'></div>
    <div class='message441'></div>
</div>

ご覧のとおり、div max には 7 つのメッセージがあります。それよりも高いメッセージはすべて消去されます (問題なく動作する場合はすべて、ほんの少しの追加情報です)。もう 1 つの注意点として、jqueryライブラリと jquery プラグインを使用しています ここ、このブログ投稿の功績による. (プラグインの機能に関する情報は、そこにあります。)


私が試したこと:

function ajaxGo() {
    $.ajaxPollSettings.pollingType = "interval";
    $.ajaxPollSettings.interval = 700;
    $.ajaxPollSettings.maxInterval = 1000;
    $.ajaxPollSettings.durationUntilMaxInterval = 2000;

    var httpcount = 1;

    var lastDiv = lastDiv = $('#chat_log').find('div:last-child');
    var lastId = lastDiv[0].className.substring(7);

    $.ajaxPoll({
        url: "place_chat/update.php",
        type: "POST",
        data: {
            where: where,
            'last': lastId
        },
        dataType: "html",
        cache: false,

        successCondition: function (result) {
            var responseString = result;

            if (result != '') {
                $(result).appendTo('#chat_log').show();
                lastDiv = lastDiv = $('#chat_log').find('div:last-child');
                lastId = lastDiv[0].className.substring(7);
                console.log(lastId);
                httpcount = httpcount + 1;

                if (!hasFocus && !titleCurrentlyChanging) {
                    changeTitle();
                }

                soundHandle = document.getElementById('soundHandle');
                soundHandle.src = '../Sounds/Message.wav';
                soundHandle.play();
            }
        }

    });
}

$(document).ready(function () {
    $('#chat_log').append('<div class="message0">Test</div>');

    setTimeout(ajaxGo, 500);
}); 

このコードは文字列 'message' を取り除き、番号を取得します。コード:

lastDiv = lastDiv = $('#chat_log').find('div:last-child');
lastId = lastDiv[0].className.substring(7);
console.log(lastId);

...コンソールに貼り付けたときに正しく機能し、正しい最後divのメッセージを出力しますid

ただし、非手動で実行された場合はそうではありません (おそらく、関数やループなどではないため)、コードは何らかの理由で、 +の0メッセージが他にある場合にのみ ' ' を送信します。など、他にも多くのことを試しました。問題を引き起こしている可能性があると思われることの1つは、変数のスコープです。ポーリングの成功が呼び出されたときに、変数が調整されないようです。ただし、これが事実であるかどうかは完全にはわかりません。その場合は、コードが正しく機能するように変数のスコープを修正する方法をサポートしていただければ幸いです。id1000setIntervalfunctionlastId

余談ですが、php は正常に動作しているため、サポートは必要ありません。

重要な編集 (問題を理解しやすくする):コード

lastDiv = lastDiv = $('#chat_log').find('div:last-child');
lastId = lastDiv[0].className.substring(7);

...問題なく動作します。問題のように見えるのは、その周辺 (構造) です。また、スクリプトが送信された場所をphpに伝えるだけで、whereこれには関係ありません。where最初に呼び出された に追加された div があることを認識しています。これは、最初のを としてtest定義することです。ループは最新の の取得を処理する必要がありますが、そうではありません。lastId0lastId

私が発見したこと: lastIdajaxPoll で編集されていません。div から正しい lastId を取得しますが、編集しませんlastId。これにより、スコープの問題であることがほぼ明確になります

4

2 に答える 2

2

1 つの問題は、ajaxPoll. 一度送信されるデータを作成すると、各ポーリングで再評価されることはありません。

もう1つの問題は、それlastIdが関数にローカルであるajaxGoことです。外側に移動します。

以下は、andを使用するjsfiddleです。jQuery.ajaxsetInterval

var lastId = 0;

function ajaxGo() {

    $.ajax({
        url: "/echo/html/",
        type: "POST",
        data: {
            'last': lastId,
            html: '<div class="message' + (parseInt(lastId) + 1) + '">' + (parseInt(lastId) + 1) + '</div>'
        },
        dataType: "html",

        success: function(result) {

            if (result) {
                $(result).appendTo('#chat_log').show();
                lastDiv = $('#chat_log').find('div:last-child');
                lastId = lastDiv[0].className.substring(7);
                console.log(lastId);

/*                if (!hasFocus && !titleCurrentlyChanging) {
                    changeTitle();
                }

                soundHandle = document.getElementById('soundHandle');
                soundHandle.src = '../Sounds/Message.wav';
                soundHandle.play();*/
            }
        }

    });
}

var timer = setInterval(ajaxGo, 1000);​

あなたの質問に関係のないコードは、コメントアウトまたは省略されています。

于 2012-09-19T21:00:10.033 に答える
0

それがスコープの問題である場合、それはおそらく置くことによって修正されるでしょう

var lastId = -1;

をコードの先頭に置き、次に に置き換えvar lastId = ...ますlastId = ...

于 2012-09-19T21:01:18.143 に答える