结果显示两次Jquery滚动到加载内容函数,Php& MYSQL

时间:2016-10-16 20:04:02

标签: php jquery

我有一个滚动到加载内容的功能,其中

 //s > selector which define the number of Sql results given by results.php?selector=s

   jQuery.fn.ShowResults = function(t,s){

    var loading  = false; //to prevents multipal ajax loads
    var track_load=0;
    var total_groups=t;

 $("#results").load("results.php?selector="+s, {'group_no':track_load},  
 function() { track_load++; });

 $(window).scroll(function() { 
        if($(window).scrollTop() + $(window).height() == $(document).height())
        {
  if(track_load <= (total_groups-1) && loading==false)
    /*I think that in this line is the clue*/
         {
             loading = true;

              $.post("results.php?selector="+s, {'group_no':track_load}, function() { 

             $('#results').append(data); 
             track_load++; 
             loading = false; 
            });
          }
      }
                         }                      
  }

 $("#results").ShowResults(8,1);

 $("#show1").on("click", function(e){  $("#results").ShowResults(8,1);});
 $("#show2").on("click", function(e){  $("#results").ShowResults(6,2);});
 $("#show3").on("click", function(e){  $("#results").ShowResults(4,3);});  

我默认selector=1;

 <a id=show1>Show 1</a>
 <a id=show2>Show 2</a>
 <a id=show3>Show 3</a>

 <ul id=results></ul>

PHP results.php?selector=1将是

if($_POST)
{

$data_per_group=10; //each group return 10 records as maximun
$group_number = $_POST["group_no"];

$position = ($group_number * $data_per_group);

 $s=$_GET['selector'];
 if($s==1){$results=mysql_query("SELECT * WHERE condition1 LIMIT $position, $data_per_group");}
 if($s==2){$results=mysql_query("SELECT * WHERE condition2 LIMIT $position, $data_per_group");}
 if($s==3){$results=mysql_query("SELECT * WHERE condition3 LIMIT $position, $data_per_group");}


 while($res=mysql_fetch_array($results)){

 $data=$res['names'];
 echo "<li>$data</li>";
} 

 } 

问题在于,有时,看起来函数被调用了两次,并且显示了像这样重复的相同结果

  <ul id=results>
  <li>AAA</li>
  <li>BBB</li>
  <li>CCC</li>
  <li>AAA</li>
  <li>BBB</li>
  <li>CCC</li>
  </ul>

我尝试使用event.preventDefault();event.stopPropagation();但没有解决方案

问题是如何停止此功能行为?看起来每当我点击锚点时,我会调用两次相同的函数并默认与集合冲突。我被告知了我们mysql_fetch_row(),但问题仍然存在。更新。经过多次测试后,我意识到它显示了两次因为滚动。我需要改进这些行if(track_load <= (total_groups-1) && loading==false),或者每当我点击一个锚时,该函数都会从默认版本中获取组total_groups的数量。

2 个答案:

答案 0 :(得分:0)

只需将track_load0更改为1

.load()请求已获得第一个'跟踪',但第一个$.post请求再次请求track_load 0

答案 1 :(得分:0)

我确实解决了这个问题,感谢所有试图帮助我的人。

问题是,无论何时我点击一个锚点a,由于某种原因,页面仍然保持total_groups的先前值。

jQuery.fn.ShowResults = function(t,s){

var total_groups=t;

   setInterval( function(){alert(total_groups);},2000)

  /*more coding*/
 }

默认设置为selector=1 $("#results").ShowResults(8,1);。因此,当我点击a id=show2 $("#results").ShowResults(6,2);时,可以看到警告setInterval(),显示不同{ {1}}值,8&amp; 6.如果我按total_groups a id=show3,警报会在一瞬间显示8,6&amp; 4.为什么会发生这种情况我仍然不知道。

所以我决定添加$("#results").ShowResults(4,2);,以便从另一个页面$ajax({});获取total_groups,该页面仅返回total_groups值。

total_groups.php?s=selector

因此,通过使用Ajax,问题终于得到解决。