JavaScript — остановить бесконечный прокрутки от повторения всего содержимого страницы
Я добавил бесконечную прокрутку на страницу, и теперь страница дублирует содержимое в верхней части страницы каждый раз, когда для бесконечной прокрутки загружается больше результатов.
Страница загружается так:
- Реклама
- Спонсированный контент
- Реклама
- Первые 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'].' </span><span style="float:left;text-align:right;font-size:12px;">Start Date: '.$row['stdate'].' </span><br/><span style="float:left;text-align:right;font-size:12px;">End Date: '.$row['endate'].' </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);
?>
Решение
Задача ещё не решена.
Другие решения
Других решений пока нет …