停止无限滚动重复所有页面内容

时间:2018-11-05 15:51:39

标签: javascript php jquery infinite-scroll jquery-infinite-scroll

我在页面上添加了无限滚动,现在每次为无限滚动加载更多结果时,页面都会从页面顶部复制内容。

页面加载如下:

  • 广告
  • 赞助内容
  • 广告
  • 无限滚动的表中前9个结果

当页面到达无限滚动的末尾时会发生

  • 广告报道
  • 赞助的内容重复
  • 广告重复
  • 根据需要在表中显示下9行。

我想知道如何停止广告和赞助内容的无限滚动。

这是我用于无限滚动的脚本:

//      Loading news
    var pageLoad = 1;
    var totalPages = 1;
    /* This is function which is called to load news. The input parameter is page, a variable which assumes number of active page. Default is 1 */
    function loadingNews(page){
        $('#events').append('<div class="loader-div"><img src="" class="img img-responsive img-loader" /></div>');
        $.ajax({
               type: "GET",
               url: "websitephppagebelow.php",
               method: "POST",
               dataType: "json",
               data: {'eventuser': '0', 'page': page},
               success: function (data) {
               $(".loader-div").remove('.loader-div');
               $('#events').append(data.deals);
               totalPages = data.totalPages;
               },
               error: function (jqXHR, exception) {
               var msg = '';
               if (jqXHR.status === 0) {
               msg = 'Not connect.\n Verify Network.';
               } else if (jqXHR.status == 404) {
               msg = 'Requested page not found. [404]';
               } else if (jqXHR.status == 500) {
               msg = 'Internal Server Error [500].';
               } else if (exception === 'parsererror') {
               msg = 'Requested JSON parse failed.';
               } else if (exception === 'timeout') {
               msg = 'Time out error.';
               } else if (exception === 'abort') {
               msg = 'Ajax request aborted.';
               } else {
               msg = 'Uncaught Error.\n' + jqXHR.responseText;
               }
               console.log(jqXHR);
               }
               });
    }

    /* Here the function for page loading is calling. The input parameter (pageLoad) is variable which constantly is updating. */
    loadingNews(pageLoad);
    /* This is the function which "listen" scrolling on the page. If it reaches the bottom of the page, sends new call to loadingNews function. */
    var win = $(window);
    win.scroll(function(){
               if ($(document).height() - win.height() == win.scrollTop()) {
               pageLoad++;
               // console.log("page load: " + pageLoad + "; total: " + totalPages);
               if(pageLoad <= totalPages) {
               loadingNews(pageLoad);
               }else{
               pageLoad--;
               }
               }
               });

               });

这是我用于无限滚动的php:

<?php
include('../db.php');

$event = '';


    if(isset($_REQUEST['myevents'])) {

if(!isset($_REQUEST['eventuser']) || (strlen($_REQUEST['eventuser']) < 2)) {

$get = mysql_query("SELECT * FROM table ORDER BY stdate ASC");

} else {

$get = mysql_query("SELECT * FROM table WHERE user = '".$_REQUEST['eventuser']."' ORDER BY stdate ASC ");

}
if(mysql_num_rows($get) > 0) {

    while($row = mysql_fetch_array($get)) {
    //echo mysql_num_rows($get).$row['id'].$row['name'].$row['stdate'].$row['description'].$row['fname'];


    $desc = substr($row['description'],0,50);

    $event .= '     <div id="eventslist" onclick="goevent('.$row['id'].');" style="border-bottom:1px solid gray;padding:2px;width:100%;float:left;">
                        <div style="width:35%;float:left;">
                            <img src="path" style="width:100%;height:140px;border-radius:10px;" class="img-rounded">
                        </div>
                        <div style="width:65%;float:left;">
                            <h4 style="margin:0;"><span style="float:left;">'.$row['fname'].'&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span style="float:left;text-align:right;font-size:12px;">Start Date: '.$row['stdate'].'&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><br/><span style="float:left;text-align:right;font-size:12px;">End Date: '.$row['endate'].'&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><br/><span style="float:left;text-align:right;font-size:12px;">City: '.$row['city'].'</span></h4><p style="margin-bottom:0;">'.substr($row['description'],0,56).'...</p>
                        </div>
                </div>  ';

    }
    //echo $event."<br/>";

    $arr['status']=1;
    $arr['msg'] = 'ok';
    $arr['deals'] = $event;

} else {
    $event .= 'No Events Found '.mysql_error();
    $arr['status']=0;
    $arr['msg'] = $event;
    $arr['deals'] = $event;
}


    } else {

if(!isset($_REQUEST['eventuser']) || (strlen($_REQUEST['eventuser']) < 2)) {

$get = mysql_query("SELECT * FROM table2 WHERE fname='mobile' ORDER BY RAND() LIMIT 1");

} else {

$get = mysql_query("SELECT * FROM table2 WHERE user = '".$_REQUEST['eventuser']."' ORDER BY stdate ASC");

}
    if(mysql_num_rows($get) > 0) {

    while($row = mysql_fetch_array($get)) {
    //echo mysql_num_rows($get).$row['id'].$row['name'].$row['stdate'].$row['description'].$row['fname'];


    $desc = substr($row['description'],0,50);

    $event .= '     <div style="float:left" class="movead"> 
                                        <p style="margin-left:5%; color:black;text-align: left;width:100%;height:15px"><b>Advertisment</b></p>
                                        <a href="'.$row['link'].'" target="_blank" style="text-decoration: none;">
                                        <div style="margin-left:2%;margin-bottom: 25px;width: 320px; height: 50px; background-image: url(path'); color: #fff; line-height: 50px; text-align: center; ">
                                        </div>
                                        </a>
                                    </div>  ';


    }
    //echo $event."<br/>";

    $arr['status']=1;
    $arr['msg'] = 'ok';
    $arr['deals'] = $event;

} else {
    $event .= 'No Events Found '.mysql_error();
    $arr['status']=0;
    $arr['msg'] = $event;
    $arr['deals'] = $event;
}


if(!isset($_REQUEST['eventuser']) || (strlen($_REQUEST['eventuser']) < 2)) {

$get = mysql_query("SELECT * FROM table WHERE promote='YES' ORDER BY RAND() LIMIT 3");

} else {

$get = mysql_query("SELECT * FROM table WHERE user = '".$_REQUEST['eventuser']."' ORDER BY stdate ASC ");

}
if(mysql_num_rows($get) > 0) {

    while($row = mysql_fetch_array($get)) {
    //echo mysql_num_rows($get).$row['id'].$row['name'].$row['stdate'].$row['description'].$row['fname'];



    $desc = substr($row['description'],0,50);

    $event .= '     <div id="eventslist" class="zoom" onclick="goevent('.$row['id'].');" style="background-image: url(path);background-position: center;background-position-y: -1px;background-repeat: no-repeat;background-size: 100% 98%;box-shadow: 0 -2px 18px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.2);border-radius: 25px 25px 0 0;padding:2px;width:103%;margin-left:-1.6%;margin-bottom: 25px;float:left;">

                        <div style="height:25px;width:101.08%;float:left;text-align: center;background-color: gold;margin-left:-.5%;margin-top:-.8%;border-radius: 25px 25px 0 0;">
                                                            <b style="font-size: 16px;">Sponsored</b>
                        </div>
                        <div style="width:101.19%;float:left;background-color: white;margin-left:-.65%;margin-top:60%;">
                                                            <div style="float:left;width:100%;text-align: center;padding-bottom: 5px;padding-top: 5px;">
                                                            <b style="font-size: 16px;">'.$row['fname'].'</b>
                                                            </div>
                                                            <div>
                            <img src="path" style="margin-top:-1%;margin-left:2%;float:left;width:20px;height:20px;"><b><span style="margin-left:-2%;float:left;text-align:left;font-size:12px;padding-left: 10px;">Start Date: '.$row['stdate'].'</span><span style="float:right;text-align:right;font-size:12px;padding-right: 10px;">City: '.$row['city'].'</span><img src="path" style="margin-top:-1%;float:right;width:20px;height:20px;"></b>
                                                            </div>
                                                            <div>
                            <p style="float:left;margin-bottom:0;padding:10px;">'.substr($row['description'],0,160).'...</p> 
                                                            </div>
                        </div>
                </div>  ';


    }
    //echo $event."<br/>";

    $arr['status']=1;
    $arr['msg'] = 'ok';
    $arr['deals'] = $event;

} else {
    $event .= 'No Events Found '.mysql_error();
    $arr['status']=0;
    $arr['msg'] = $event;
    $arr['deals'] = $event;
}


    }

if(!isset($_REQUEST['eventuser']) || (strlen($_REQUEST['eventuser']) < 2)) {

$get = mysql_query("SELECT * FROM table2 WHERE fname='mobile' ORDER BY RAND() LIMIT 1");

} else {

$get = mysql_query("SELECT * FROM table2 WHERE user = '".$_REQUEST['eventuser']."' ORDER BY stdate ASC");

}
if(mysql_num_rows($get) > 0) {

    while($row = mysql_fetch_array($get)) {
    //echo mysql_num_rows($get).$row['id'].$row['name'].$row['stdate'].$row['description'].$row['fname'];


    $desc = substr($row['description'],0,50);

    $event .= '     <div style="float:left" class="movead"> 
                                        <p style="margin-left:5%; color:black;text-align: left;width:100%;height:15px"><b>Advertisment</b></p>
                                        <a href="'.$row['link'].'" target="_blank" style="text-decoration: none;">
                                        <div style="margin-left:2%;margin-bottom: 25px;width: 320px; height: 50px; background-image: url(path); color: #fff; line-height: 50px; text-align: center; ">
                                        </div>
                                        </a>
                                    </div>  ';


    }
    //echo $event."<br/>";

    $arr['status']=1;
    $arr['msg'] = 'ok';
    $arr['deals'] = $event;

} else {
    $event .= 'No Events Found '.mysql_error();
    $arr['status']=0;
    $arr['msg'] = $event;
    $arr['deals'] = $event;
}



$numberRecords = 9;
$page = 1;
$limitLower = 3;
$limitUpper = 9;
$loadHtmlRes = '';

$page = $_REQUEST['page'];
$limitLower = ($page-1)*$numberRecords;
$limitUpper = $page*$numberRecords;
$allNewsQuery = mysql_query("select * from table");
$totalPages = ceil(mysql_num_rows($allNewsQuery)/9);

if(!isset($_REQUEST['eventuser']) || (strlen($_REQUEST['eventuser']) < 2)) {

$get = mysql_query("SELECT * FROM table ORDER BY stdate ASC LIMIT ".$limitLower.", 9");

}
if(mysql_num_rows($get) > 0) {

    while($row = mysql_fetch_array($get)) {
    //echo mysql_num_rows($get).$row['id'].$row['name'].$row['stdate'].$row['description'].$row['fname'];

        $getf = mysql_query("SELECT * FROM private WHERE eventid = '".$row['id']."' AND state = 'NY'");
        if(mysql_num_rows($getf) > 0) { } else {


    $desc = substr($row['description'],0,50);

    $event .= '     <div id="eventslist" class="zoom" onclick="goevent('.$row['id'].');" style="background-image: url(path');background-position: center;background-position-y: -1px;background-repeat: no-repeat;background-size: 100% 98%;box-shadow: 0 -2px 18px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.2);border-radius: 16px 16px 0 0;padding:2px;width:103%;margin-left:-1.6%;margin-bottom: 25px;float:left;">


                        <div style="width:101.19%;float:left;background-color: white;margin-left:-.65%;margin-top:60%;">
                                                            <div style="float:left;width:100%;text-align: center;padding-bottom: 5px;padding-top: 5px;">
                                                            <b style="font-size: 16px;">'.$row['fname'].'</b>
                                                            </div>
                                                            <div>
                            <img src="path" style="margin-top:-1%;margin-left:2%;float:left;width:20px;height:20px;"><b><span style="margin-left:-2%;float:left;text-align:left;font-size:12px;padding-left: 10px;">Start Date: '.$row['stdate'].'</span><span style="float:right;text-align:right;font-size:12px;padding-right: 10px;">City: '.$row['city'].'</span><img src="path" style="margin-top:-1%;float:right;width:20px;height:20px;"></b>
                                                            </div>
                                                            <div>
                            <p style="float:left;margin-bottom:0;padding:10px;">'.substr($row['description'],0,160).'...</p> 
                                                            </div>
                        </div>
                </div>  ';

        }       
    }
    //echo $event."<br/>";

    $arr['status']=1;
    $arr['msg'] = 'ok';
    $arr['deals'] = $event;
    $arr['totalPages'] = $totalPages;

} else {
    $event .= 'No Events Found '.mysql_error();
    $arr['status']=0;
    $arr['msg'] = $event;
    $arr['deals'] = $event;
}



echo json_encode($arr);

?>

0 个答案:

没有答案