1

ajaxを使用してデータベースから新しい行を取得しようとしています。Facebookのチャットで起こるようなことです。私がやっていることは、2 秒ごとに ajax を使用してデータベースから最後の 10 行を取得し、ユーザーが見ていない行を表示しようとすることです。IDと名前の2つの列があります。onordered リストを作成し、各 li 要素の ID をデータベースの ID に設定しました。各 li は行です。次に、最後の li 要素の ID を取得して、データベースの ID が大きいかどうかを確認します。大きい場合は、ID と名前を含む新しい li を追加します。しかし、何らかの理由で、2 秒ごとに 10 行全体を追加するだけです。私は何を間違えましたか？これは私が使用しているコードです。

<ol id="output"><li id="1">test</li></ol>

<script id="source" language="javascript" type="text/javascript">



function reloadw() 
{


 $.ajax({                                      
  url: 'api.php',                  
  data: "",        
  dataType: 'json',                     
  success: function(rows)         
  {
  for (var i in rows)
{   
var row = rows[i]; 
  var lastId = $('ol#output li').attr('id');
   var id = row[0];
  var vname = row[1];



  if(id > lastId){
  $('#output').append("<li id="+id+"><b>id: </b>"+id+"<b> name: </b>"+vname+"</li>"); 
  }}
  }

});
 }  setInterval(reloadw,2000);

これは、データベースからデータを取得する際に使用するものです

$result = mysql_query("SELECT * FROM $tableName ORDER BY id");            
$data = array();
for($i=0;$i<=9;$i++){
 $row = mysql_fetch_row($result);
$data[] = $row;
}
echo json_encode( $data );
4

4 に答える 4

1

データをフェッチしている問題を解決する場合、JavaScript コードに別の問題があります。

変化する

var lastId = $('ol#output li').attr('id'); //will always fetch the first li's id

に

var lastId =  $('ol#output li:last').attr('id');

あなたが持っているlastId選択コードを使用すると、最初の要素のIDのみが常にフェッチさid > lastIdれ、最初の要素のIDを除いて、比較は常にtrueになります。そのため、そのレコードが以前に追加されていたとしても、追加することになります。

ただし、理想的には、サーバーでこのロジックを実行して、表示されるデータのみを取得する必要があります。

于 2013-09-23T00:17:29.773 に答える
0

JavaScript コードは次のように記述できます。

    <script>

        var seen = new Array();
        function reloadw(){


         $.ajax({                                      
          url: 'api.php',                  
          data: "",        
          dataType: 'json',                     
          success: function(rows){

          rows.forEach(function(row){


               if(seen.indexOf(row.id) == -1){

                         $('#output').append("<li id="+row.id+"><b>id: </b>"+row.id+"<b> name: </b>"+row.name+"</li>"); 

                          seen.push(row.id);

                      }

});

         }  setInterval(reloadw,2000);
    </script>
于 2013-09-23T01:02:28.803 に答える
0

データベースからの最後の結果を並べ替えたい場合、これは非常に簡単です。SQL で次のコードを試すことができます。$result = mysql_query("SELECT * FROM $tableName ORDER BY id DESC");

于 2013-09-23T00:23:09.877 に答える
0 
var lastId = $('ol#output li').attr('id');

その行は常にリストの最初の要素を検索しますが、おそらく最後の要素を探しています。行を次のように置き換えてみてください。

var lastId = $('ol#output li').last().attr('id');
于 2013-09-23T00:33:20.260 に答える