С помощью jquery я создал вызов ajax. Я использую метод GET для получения данных из базы данных с изображениями. Этот вызов ajax запускается функцией прокрутки. Если пользователь достиг дна, активируйте вызов ajax. Первый вызов ajax активируется, если документ готов и загружает 24 строки После этого я использую функцию прокрутки и загружаю 12 строк каждый раз, когда пользователь прокручивает вниз.
Иногда скрипт загружает 2 одинаковых изображения с одинаковым идентификатором. Он дублируется, но я не могу найти проблему. Я пробовал разные вещи, чтобы остановить функцию прокрутки - это вызов ajax, и активировать функцию прокрутки, если ajax успешен. Ниже приведен код jquery и php.
<script>
$(document).ready(function(){
var count = 0;
//ajax call
$.ajax({
type: "GET",
url: "result.php",
data: {
'offset': flag,
'limit':24
},
success: function(data){
$('.gallery').append(data);
count += 24;
}
});
$(window).on("scroll", windowScroll);
function wscroller(ev) {
if ((window.innerHeight + window.scrollY) >= document.body.offsetHeight) {
$(".loading").fadeIn().stop();
$(window).off('scroll', wscroller);
$.ajax({
type: "GET",
url: "result.php",
data: {
'offset': flag,
'limit': 12
},
success: function(data) {
$(".loading").fadeOut(500).stop();
$('.gallery').append(data);
count += 12;
;
$(window).on("scroll", wscroller);
}
});
}
};
});
</script>
<?php
if (isset($_GET['offset']) && isset($_GET['limit'])){
include_once 'config.php';
$offset = $_GET['offset'];
$limit = $_GET['limit'];
$data = mysqli_query($connection, "SELECT * FROM images ORDER BY uploaded_on DESC LIMIT {$limit} OFFSET {$offset}");
while($row = mysqli_fetch_array($data)){
$imageURL = 'uploads/'.$row["file_name"];
$imageID = $row["id"];
$type = pathinfo($imageURL,PATHINFO_EXTENSION);
$path_parts = pathinfo($imageURL);
$fileExtension = $path_parts['extension'];
if ($fileExtension == "jpg"){
print'<div class = "grid_photo"><img class = "photos" src = "' . $imageURL . '" alt = "" nr = "' . $imageID . '" /></div>';
}elseif ($fileExtension == "JPG"){
print'<div class = "grid_photo"><img class = "photos" src = "' . $imageURL . '" alt = "" nr = "' . $imageID . '" /></div>';
}elseif ($fileExtension == "png"){
print'<div class = "grid_photo"><img class = "photos" src = "' . $imageURL . '" alt = "" nr = "' . $imageID . '" /></div>';
}elseif ($fileExtension == "PNG"){
print'<div class = "grid_photo"><img class = "photos" src = "' . $imageURL . '" alt = "" nr = "' . $imageID . '" /></div>';
}elseif ($fileExtension == "jpeg"){
print'<div class = "grid_photo"><img class = "photos" src = "' . $imageURL . '" alt = "" nr = "' . $imageID . '" /></div>';
}elseif ($fileExtension == "JPEG"){
print'<div class = "grid_photo"><img class = "photos" src = "' . $imageURL . '" alt = "" nr = "' . $imageID . '" /></div>';
}elseif ($fileExtension == "gif"){
print'<div class = "grid_photo"><img class = "photos" src = "' . $imageURL . '" alt = "" nr = "' . $imageID . '" /></div>';
}elseif ($fileExtension == "GIF"){
print'<div class = "grid_photo"><img class = "photos" src = "' . $imageURL . '" alt = "" nr = "' . $imageID . '" /></div>';
}elseif ($fileExtension == "mp4"){
print'<div class = "grid_video extra"><video controls class = "videos"><source type = "video/mp4" src = "' . $imageURL . '" alt = "" nr = "' . $imageID . '"></video></div>';
}elseif ($fileExtension == "MP4"){
print'<div class = "grid_video extra"><video controls class = "videos"><source type = "video/mp4" src = "' . $imageURL . '" alt = "" nr = "' . $imageID . '"></video></div>';
}
}
}
?>
Как я могу исправить эту проблему?






Поскольку страница доходит до конца, а иногда и дважды, чтобы избежать этого, вы должны использовать setTimeout(), но перед этим вы должны clearTimeout(var);
это setInterval (), а не setTimeout (), что вызывает повторяющиеся вызовы после x времени
Оба могут использоваться одинаково, но вы правы, я запутался
Привет, изначально вам нужно получить общий результат, Затем вам нужно посчитать общее количество страниц. Например есть 120 результатов 12 страниц, потому что 12 результатов на запрос. Так что всего вам нужно отправить всего 12 звонков
Установить начальную страницу как 1 в одном скрытом поле.
Когда пользователь прокручивает страницу вниз до конца
Увеличьте номер страницы на 1 и обновите скрытое поле.
Затем еще раз получить номер страницы из скрытого поля.
Это потому, что для следующего запроса уже загружено 12 результатов, нам нужно получить результат с 13 по 24.
Затем проверьте номер страницы <= общее количество страниц; Чтобы избежать нежелательных запросов.
Если да, то отправьте запрос В противном случае оставьте это.
Теперь пользователь прокручивает страницу вниз перед загрузкой предыдущего запроса. Номер страницы увеличивается, и результаты загружаются правильно.
Попробуйте этот алгоритм.
Я решил проблему. Проблема заключалась не в вызове ajax, а в запросе SQL. Я отсортировал по «uploaded_on», а не по «ID». Пользователь загружает несколько файлов, а изображения имеют одинаковую дату и время.
setTimeout () будет вызывать функцию каждые x мс. Не самое лучшее с точки зрения его потребностей. Он хочет знать, прокручивал ли кто-нибудь или нет