Вход

Просмотр полной версии : Event Scroll


BobJack201
13.11.2012, 06:30
Доброе утро всем, помогите решить проблему

index.php
var num = 10;
function getNextContent(){
$.ajax({
url: "ajax-load.php",
type: "GET",
data: {"num": num},
cache: false,
success: function(response){
if(response == 0){
}else{
num = num + 10;
$("#Updates").append(response);


}
}
});
};
$(window).scroll(function(){
var windowscrollTop = $(window).scrollTop();
var documentheight = $(document).height();
var windowheight = $(window).height();
var option1 = 50;
var opa = documentheight - windowheight - option1;
if (windowscrollTop > opa)
{
getNextContent();
};
});


ajax-load.php
<?php
@mysql_connect("###", "###", "#");
mysql_query("SET NAMES utf8");
$db = @mysql_select_db("###");
if(isset($_GET['num'])){
$num = $_GET['num'];
$sql = mysql_query("SELECT * FROM ### ORDER BY id DESC LIMIT $num , 10");
if(!$sql)
{
echo "Возникла ошибка - ".mysql_error()."<br>";
echo $sql;
exit();
}
if(mysql_num_rows($sql) > 0){
while($row = mysql_fetch_array($sql))
{
printf ("###");
}
}
}
?>

Выводит все записи динамически при прокрутки почти до самого низа скролла при помощи "колёсика" на мышки. Если кликать мышкой на скролл бар в самый низ - тоже всё нормально. Но если зажать кнопку мышки и "затягивать" скролл в самый низ принудительно - то функция вывода контента выведит сразу несколько раз один и тот же материал с БД.

Помогите пофиксить :help: :help: :help: Буду очень благодарен

danik.js
13.11.2012, 07:03
Заводишь видимую в обеих функциях переменную-флаг.
var busy = false;

перед ajax-запросом устанавливаешь ее в true. После выполнения запроса (в обработчике success или error или как там в jquery) выставляешь ее в false.

а по onscroll проверяешь ее:
if (busy)
return;

BobJack201
13.11.2012, 08:18
Заводишь видимую в обеих функциях переменную-флаг.
var busy = false;

перед ajax-запросом устанавливаешь ее в true. После выполнения запроса (в обработчике success или error или как там в jquery) выставляешь ее в false.

а по onscroll проверяешь ее:
if (busy)
return;


var num = 10;
var ajax_status = 1;
function getNextContent(){
var ajax_status = 1;
$.ajax({
url: "ajax-load.php",
type: "GET",
data: {"num": num},
cache: false,
success: function(response){
if(response == 0){
}else{
num = num + 10;
$("#Updates").append(response);
var ajax_status = 0;
}
}
});
};
$(window).scroll(function(){
var windowscrollTop = $(window).scrollTop();
var documentheight = $(document).height();
var windowheight = $(window).height();
var option1 = 50;
var opa = documentheight - windowheight - option1;

if ((windowscrollTop > opa) && (ajax_status == 1)){

getNextContent();
};
});

Не пофиксилось ((((:cray:

А через Onscroll у меня при перезапуске значение false, а после первого движение колёсиком true на всё время.

danik.js
13.11.2012, 09:47
var num = 10;
var ajax_status = 0;

function getNextContent(){
ajax_status = 1;
$.ajax({
url: "ajax-load.php",
type: "GET",
data: {"num": num},
cache: false,
success: function(response){
ajax_status = 0;
if(response == 0){
}else{
num = num + 10;
$("#Updates").append(response);
}
}
});
};
$(window).scroll(function(){
if (ajax_status == 1)
return;
var windowscrollTop = $(window).scrollTop();
var documentheight = $(document).height();
var windowheight = $(window).height();
var option1 = 50;
var opa = documentheight - windowheight - option1;

if (windowscrollTop > opa)
getNextContent();
});


1)Ключевое слово var нужно указывать только при объявлении переменной.
2)Определитесь со значениями переменной ajax_status. Думаю понятней что изначально код 0, а во время запроса - 1.
3)Проверять ajax_status надо сразу, чтобы не производить напрасные расчеты (это не абы-что, а прокрутка, а она и так не всегда плавная)

BobJack201
14.11.2012, 07:34
Код работает - спасибо тебе большое! :)