Показать сообщение отдельно
  #1 (permalink)  
Старый 18.05.2018, 01:23
Профессор
Отправить личное сообщение для djonA Посмотреть профиль Найти все сообщения от djonA
 
Регистрация: 02.05.2012
Сообщений: 197

alert массив данных при скролинге
Подскажите нужно при каждом скроле страницы добавлять видимые элементы в массив если их там еще нет, и делать alert этого массива.

Пробую так:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"  type="text/javascript"></script>

<script type="text/javascript">
var viewed = [];
function checkPosition(){
var needclass = $('.divtovata'); //Ищем все элементы по классу
needclass.each(function (index, element) {
if ($(document).scrollTop() + $(window).height() > $(element).offset().top && $(document).scrollTop() - $(element).offset().top < $(element).height() && $.inArray($(element).attr('data-product-id'), viewed) == -1) { //Проверяем показывался ли элемент ранее и виден ли он сейчас
viewed.push($(element).attr('data-product-id')); //Добавляем элемент в массив, чтобы больше не отправлять по нему данные. Вставляем код отправки сюда
}
});
}
$(document).ready(function(){
$(document).scroll(function(){
checkPosition();


});
checkPosition();

 $(window).resize(function(){
 checkPosition();

});
});

alert(viewed);
</script>

<div class="divtovata"><span class="a1">1</span></div>
<br><br><br><br><br>
<div class="divtovata"><span class="a1">2</span></div>
<br><br><br><br><br>
<div class="divtovata"><span class="a1">3</span></div>
<br><br><br><br><br>
<div class="divtovata"><span class="a1">4</span></div>
<br><br><br><br><br>
<div class="divtovata"><span class="a1">5</span></div>


Т.е при открытии страницы надо вывести в массим и сделать алерт видимых элементов class="a1".
При скроле страницы вниз надо в массив добавлять видимые элементы которых еще нет в массиве и опять же alert всего массива.
Если возвращаемся в начало страницы то существующие элементы в массив повторно не добавляем.
Ответить с цитированием