當頁面底部自動加載新的評級/啓動系統數據

我有一個調用我的index.php文件中的自動加載功能來加載更多的數據時，到達頁面的底部。這裏我也定義樣式爲我的等級（星級）：當頁面底部自動加載新的評級/啓動系統數據

<style> 
span.stars, span.stars span { 
display: block; 
background: url(stars.png) 0 -16px repeat-x; 
width: 80px; 
height: 16px; 
} 
span.stars span { 
background-position: 0 0; 
} 
</style> 

<script type="text/javascript"> 
$(document).ready(function() { 
var track_load = 0; //total loaded record group(s) 
    var cityname = '<?=$city;?>'; 
var loading = false; //to prevents multipal ajax loads 
var total_groups = <?=$total_groups;?>; //total record group(s) 
    var total_rows = <?=$get_total_rows;?>; 

$('#results').load("autoload_process.php",  {'group_no':track_load,'nameofcity':cityname}, function() {track_load++;}); //load first group 
$(window).scroll(function() { //detect page scroll 

    if($(window).scrollTop() + $(window).height() == $(document).height()) //user scrolled to bottom of the page? 
    { 
     if(track_load <= total_groups && loading==false) //there's more data to load 
     { 
      loading = true; //prevent further ajax loading 
      $('.animation_image').show(); //show loading image 
      //load data from the server using a HTTP POST request 
      $.post('autoload_process.php',{'group_no': track_load, 'nameofcity':cityname}, function(data){ 
       $("#results").append(data); //append received data into the element 
       //hide loading image 
       $('.animation_image').hide(); //hide loading image once data is received 
       track_load++; //loaded group increment 
       loading = false; 
      }).fail(function(xhr, ajaxOptions, thrownError) { //any errors? 
       alert(thrownError); //alert with HTTP error 
       $('.animation_image').hide(); //hide loading image 
       loading = false; 
      }); 
     } 
    } 
}); 
}); 
</script>

然後在我的autoload_process.php我從數據庫中檢索信息，我打印出來。我檢索並打印的其中一個信息是評分。我在這個文件中也有我的腳本來打印評分。

<script type="text/javascript"> 
$(function() { 
$('span.stars').stars(); 
}); 

$.fn.stars = function() { 
return $(this).each(function() { 
$(this).html($('<span />').width(Math.max(0, (Math.min(5, parseFloat($(this).html())))) * 16)); 
}); 
} 
</script> 

    $db = pg_connect("$db_host $db_name $db_username $db_password"); 
    $query = "SELECT * FROM table; 
    $rating = $myrow[rating]; 
    echo '<span class="stars">'; 
    echo $rating; 
    echo '</span>';

當頁面是首次加載的一切工作正常，但我的問題是，當我一路滾動至底部，並在頁面重新加載新信息的評級調整。它接縫是每次一組新的數據加載所有以前收視率被設定爲（按照例如酒店1）的所有第一項的值

例子：（讓我們說，我加載3個結果在時間）

第一負載：

Hotel 1 --> Rating 5 (This is correct)  
Hotel 2 --> Rating 4 (This is correct)  
Hotel 3 --> Rating 3 (This is correct)

現在，我得到的頁面的底部，下一個信息被加載（第二負載）：

Hotel 1 --> Rating 5 (This is INCORRECT) filled with first value (Hotel1)  
Hotel 2 --> Rating 5 (This is INCORRECT) filled with first value (Hotel1)  
Hotel 3 --> Rating 5 (This is INCORRECT) filled with first value (Hotel1)  
Hotel 4 --> Rating 2 (This is correct)  
Hotel 5 --> Rating 1 (This is correct)  
Hotel 6 --> Rating 3 (This is correct)

現在讓我們一頁面的底部，未來信息被加載（第三負載）：

Hotel 1 --> Rating 5 (This is INCORRECT) filled with first value (Hotel1)  
Hotel 2 --> Rating 5 (This is INCORRECT) filled with first value (Hotel1)  
Hotel 3 --> Rating 5 (This is INCORRECT) filled with first value (Hotel1)  
Hotel 4 --> Rating 5 (This is INCORRECT) filled with first value (Hotel1)  
Hotel 5 --> Rating 5 (This is INCORRECT) filled with first value (Hotel1)  
Hotel 6 --> Rating 5 (This is INCORRECT) filled with first value (Hotel1)  
Hotel 7 --> Rating 3 (This is correct)  
Hotel 8 --> Rating 2 (This is correct)  
Hotel 9 --> Rating 1 (This is correct)

任何幫助，將不勝感激

來源

2016-04-22 Sam

當頁面底部自動加載新的評級/啓動系統數據

回答

相關問題