0

私の問題を探していくつかの AJAX スレッドを調べましたが、私の場合の解決策が見つかりませんでした。つまりね：

ユーザーのコメントがあるページがあります。これらのコメントはデータベースに保存され、ユーザーが「更新」ボタンを押すたびにデータベースに接続され、応答としてコメントが取得されます。新しいメッセージがある場合は、「There are _ new messages」という div があります。ただし、この最後のメッセージは、メッセージが読み込まれる前に表示されるため、正しく表示されません。

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

AJAX 関数

function GetComments()
{
    $("#cont-comment").empty(); //div that contains the messages
    $.ajax(
    {
        url: "get.php",
        dataType: "json",
        success: function(data)
        {
            n_msg=data.length;
            for (i=0; i<n_msg; i++)
            {
                nick=data[i].nick;
                msg=data[i].msg;
                WriteNewComment(nick,msg);
                num_comments=document.getElementsByClassName("comment-msg").length;
            }
        } 
    });
}

そして、ここに問題があります。

$("#refresh").click(function()
{
    num_comments_before=num_comments;
    GetComments();
    alert("done");
});

新しいコメントの前に「完了」メッセージが表示されます。新しいコメントが表示されたとき、つまりAJAXが終了したときにのみ、「完了」というメッセージが表示されるようにしたいと思います。

4

4 に答える 4

0

ajax は非同期呼び出しであるため、ブラウザーは ajax 呼び出しを行うとすぐにスレッドを生成し、そのフローを続行します。そのため、「完了」メッセージが新しいコメントの前に表示されます。強く必要とされない限り、コードをブロックしないことが理想的です。

以下に示すように、コールバックで alert('done') 関数を呼び出すことができます...

 function GetComments(alertFunction)
{
    $("#cont-comment").empty(); //div that contains the messages
    $.ajax(
    {
        url: "get.php",
        dataType: "json",
        success: function(data)
        {
            n_msg=data.length;
            for (i=0; i<n_msg; i++)
            {
                nick=data[i].nick;
                msg=data[i].msg;
                WriteNewComment(nick,msg);
                num_comments=document.getElementsByClassName("comment-msg").length;
            }

          **alertFunction();**
        } 
    });
}



$("#refresh").click(function()
{
    num_comments_before=num_comments;
    GetComments(alertFunction);

});

function alertFunction(){
  alert("done");
}
于 2014-09-02T17:37:14.123 に答える
0

jQuery はPromises/A 仕様に適切に準拠していませんが、$.ajax()メソッドは応答ロジックを処理するために利用できる遅延オブジェクトを返します。これが機能する1つの方法は次のとおりです。

$.when(getComments).then(processComments);

function getComments() {
    $("#cont-comment").empty();
    return $.ajax({
        url: "get.php",
        dataType: "json",

    });
}

function processComments(data) {
    n_msg=data.length;
    for (i=0; i<n_msg; i++) {
        nick=data[i].nick;
        msg=data[i].msg;
        WriteNewComment(nick,msg);
        num_comments=document.getElementsByClassName("comment-msg").length;
    }
    alert("done");
}

JavaScriptに関しては、同期的に行うことは一般的にベストプラクティスとは見なされません.コールバックアプローチは問題ありませんが、マルチネストの狂気と面倒なエラー処理に悩まされます.

于 2014-09-02T18:14:26.907 に答える
-1

追加する場合:

非同期: false

ajax 呼び出しに対して、javascript は続行する前に ajax 関数が (成功またはエラーを) 返すのを待ちます。

http://api.jquery.com/jquery.ajax/

于 2014-09-02T17:14:36.573 に答える