Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 13.11.2012, 06:30
Новичок на форуме
Отправить личное сообщение для BobJack201 Посмотреть профиль Найти все сообщения от BobJack201
 
Регистрация: 13.11.2012
Сообщений: 3

Event Scroll
Доброе утро всем, помогите решить проблему

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 ("###");
			}
			}
			}
					?>


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

Помогите пофиксить Буду очень благодарен
Ответить с цитированием
  #2 (permalink)  
Старый 13.11.2012, 07:03
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

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

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

а по onscroll проверяешь ее:
if (busy)
    return;
Ответить с цитированием
  #3 (permalink)  
Старый 13.11.2012, 08:18
Новичок на форуме
Отправить личное сообщение для BobJack201 Посмотреть профиль Найти все сообщения от BobJack201
 
Регистрация: 13.11.2012
Сообщений: 3

Сообщение от danik.js Посмотреть сообщение
Заводишь видимую в обеих функциях переменную-флаг.
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();
			};
});


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

А через Onscroll у меня при перезапуске значение false, а после первого движение колёсиком true на всё время.
Ответить с цитированием
  #4 (permalink)  
Старый 13.11.2012, 09:47
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

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 надо сразу, чтобы не производить напрасные расчеты (это не абы-что, а прокрутка, а она и так не всегда плавная)
Ответить с цитированием
  #5 (permalink)  
Старый 14.11.2012, 07:34
Новичок на форуме
Отправить личное сообщение для BobJack201 Посмотреть профиль Найти все сообщения от BobJack201
 
Регистрация: 13.11.2012
Сообщений: 3

Код работает - спасибо тебе большое!
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
как создать event, эмулирующий enter Artanis Events/DOM/Window 7 16.07.2019 06:40
scroll event Rikimaru2013 Events/DOM/Window 3 09.11.2012 10:36
event + setTimeout fsingle Events/DOM/Window 2 02.05.2012 09:07
Как изменить положение scroll? PAMAC Общие вопросы Javascript 3 25.11.2010 18:22
div с overflow-y: scroll; + большой контент + Opera/Firefox bug no. Общие вопросы Javascript 2 24.02.2009 11:20