ウェブチャットでsetTimeoutでAJAXを停止すると、同時にチャットラインを表示することができます。

Question

「チャット 'チャットライン」を作成するにはどうすればよいですか？画面に印刷します。私はsetTimeout()を配置しようとしましたが、それは私がそれをしたい時間を待つことはありません。私はさらにsleep(10)となるPHPファイルに入るためにajax関数を作った後、メインレンダリングケースに戻りますが、これを行うことはできません。理由を知らない...

チャットラインを10秒ごとに読み込む時間を設定するにはどうすればよいですか？たとえば、2つ以上のチャットラインが同じ時間に提出され、10秒間に表示された順番で送信された場合、 と同じ時刻に送信された行は、Line1、Line2、およびLine3となります。

LINE 1：ハロー

//ショーL​​INE後10秒2

LINE 2：HI

//ショーL​​INE後10秒3

LINE 3：GREAT

私は、PHPファイルで行ったすべてであることを
http://tutorialzine.com/2010/10/ajax-web-chat-php-mysql/
http://tutorialzine.com/2010/10/ajax-web-chat-css-jquery/

：

wait.class.phpファイルは、このための完全なコードがある

です。 私は何を作っていますがAJAXでのWebチャットで、私は「ケース 『chatLine』：」を作るにはどうすればよい

// The login method hides displays the 
// user's login data and shows the submit form 

login : function(name,gravatar){ 

    chat.data.name = name; 
    chat.data.gravatar = gravatar; 
    $('#chatTopBar').html(chat.render('loginTopBar',chat.data)); 

    $('#loginForm').fadeOut(function(){ 
     $('#submitForm').fadeIn(); 
     $('#chatText').focus(); 
    }); 

}, 

// The render method generates the HTML markup 
// that is needed by the other methods: 

render : function(template,params){ 



    function wait(){ 
     $.ajax({ 
      url: "php/classes/wait.class.php", 
      type: "POST", 
      data: { 
       'text': params.text, 
       'time': params.time 
      }, 
     }) 
    } 
    var arr = []; 
    switch(template){ 
     case 'loginTopBar': 
      arr = [ 
      '<span><img src="',params.gravatar,'" width="23" height="23" />', 
      '<span class="name">',params.name, 
      '</span><a href="" class="logoutButton rounded">Logout</a></span>']; 
     break; 

     case 'chatLine': 
      arr = [ 
       '<div class="chat chat-',params.id,' rounded"><span class="gravatar">'+ 
       '<img src="',params.gravatar,'" width="23" height="23" '+ 
       'onload="this.style.visibility=\'visible\'" />', 
       '</span><span class="author">',params.author, 
       ':</span><span class="text">',params.text, 
       '</span><span class="time">',params.time,'</span></div>']; 
     break; 

     case 'user': 
      arr = [ 
       '<div class="user" title="',params.name,'"><img src="',params.gravatar, 
       '" width="30" height="30" onload="this.style.visibility=\'visible\'"'+ 
       ' /></div>' 
      ]; 
     break; 
    } 

    // A single array join is faster than 
    // multiple concatenations 

    return arr.join(''); 

}, 

Answer 1

表示できるようにしたいプリントに のparamsを送信する前に一定時間待機し画面上。

あなたは、パラメータとして送信された機能「コールバック」にすべてのあなたのロジックを移動する必要があります、

render : function(template,params, callback){ 

のようなものをコールバック関数を使用して、

case 'chatLine': 
    setTimeout(function(){ callback(arr); }, 10000); 

ことができます。また、他のすべてのケースで関数コールバックを呼び出す必要があります。

render(template, params, callback); 

function callback(results){ 
//process results, print on the screen 
} 

それは私がscript.js部分5で:)

Answer 2

ルックを説明が下手だということが可能です。タイミングを設定する変数はnextRequestです。

nextRequestは、コードのこの部分に、最新のチャットアクティビティからの経過時間によって設定できます。ここでは、ニーズに合わせてタイミングを変更できます。

発行元：スクリプト。JS - パート5

 var nextRequest = 1000; 

     // 2 seconds 
     if(chat.data.noActivity > 3){ 
      nextRequest = 2000; 
     } 

     if(chat.data.noActivity > 10){ 
      nextRequest = 5000; 
     } 

     // 15 seconds 
     if(chat.data.noActivity > 20){ 
      nextRequest = 15000; 
     } 

Answer 3

あなたのコード内の二つの問題があります

1. はjQuery.ajaxはそうjavascriptのコードはまだサーバの応答を待たずに実行を継続非同期れます。それを同期するように変更するパラメータがありますが、サーバは多くのリソースを消費する多くのスリープ要求をスタックします。したがって、このメソッドを使用しないでください。

2. "arr"変数は常にレンダリングが呼び出されるたびに1つの項目を持ちますので、 "arr"を使用する必要はありません。ただHTML文字列を返すだけでOKです。ここで

は私のソリューションです：

1. 代わりに呼び出しのサーバから受信したデータは、グローバル配列に「テンプレート」と「のparams」を追加し、すぐにレンダリングした後。

   var items = []; 
   items[] = { 'template': template, 'params': params }; 
   // Begin render and display data if process isn't running 
   // Note: "running" variable is defined in (2.) 
   if(running == false) { 
       display(); 
   } 
   

2. は、「表示」機能は2つのことを行うの作成：HTML文字列を作成し、文書化するその文字列を追加するタイミングを決定するために、「レンダリング」と呼びます。スイッチ（）ステートメント内

   var running = false; 
   function display() { 
       running = true; 
       var item = null; 
       var html = []; 
       while(items.length > 0) { 
        item = items.shift(); 
        // Render HTML string 
        html[] = render(item.template, item.params); 
        // Stop render and output HTML data 
        if(item.template == 'chatLine') { 
         break; 
        } 
       } 
       // A single array join is faster than multiple concatenations 
       html = html.join(''); 
       // TODO: Add rendered HTML string to document 
       ... 
       if(items.length > 0) { 
        // Call "display" again after 10 seconds 
        setTimeout(display, 10000); 
       } else { 
        // There is no item need to render then stop process 
        running = false; 
        // Note: Next time received data from server 
        // "display" will be called as in (1.) 
       } 
   }