Javascript постепенно исчезает

Я использую JavaScript ниже, чтобы рекурсивно перезагрузить целевой DIV, чей id="outPut"с результатами запроса данных, выполняемого при передаче аргументов getData.php, Проблема заключается в том, что fadeTo затухает во всех данных, возвращаемых при каждом итеративном вызове.

getData форматирует каждую строку данных, возвращаемых в своем собственном DIV, поэтому, если для данной итерации selectData было вызвано 10 записей, а новые записи не добавляются до следующей итерации selectData, то 10 возвращенных данных DIV, загруженных в DIV «outPut», должны не все исчезают и не возвращаются, но остаются заметно неизменными. Тем не менее, если 11-я запись добавлена ​​до следующей версии selectData, тогда только DIV новой 11-й записи должен исчезнуть, присоединившись к ранее существующим 10 DIV, все из которых должны были оставаться постоянно видимыми, поскольку они уже были там в предыдущем итерация.

Подводя итог, как можно использовать fadeTo для постепенного visibility только что нового с момента последнего звонка?

function selectData()

{

$("#outPut").load("getData.php?userid=" + userId + "&flow=" + flow + "&order=" + order).fadeTo(0,0).fadeTo(500,1);

setTimeout(selectData, 2000);

$.ajaxSetup
(
{
cache:false
}
);
}

0

Решение

Если я вас правильно понимаю, ваш getData.php страница возвращает записи, которые были помещены в элементы DIV, которые (через .load()) станьте потомком DIV вашего основного контейнера div #outPut, А также getData.php всегда возвращает все данные из записи 1 и далее. Таким образом, вы получите что-то вроде:

<div id="outPut">
<div>Record 1</div>
<div>Record 2</div>
</div>

Если предположить, что это так, то перед вызовом .load() Вы можете проверить, сколько там детей DIV, а затем .load()затем исчезают новые:

var $outPut = $("#outPut");
function selectData() {
var count = $outPut.children("div").length;
$outPut.load("getData.php?userid=" + userId + "&flow=" + flow + "&order=" + order,
function() {
$outPut.children("div").slice(count).fadeTo(0,0).fadeTo(500,1);
}
);

setTimeout(selectData, 2000);
}

Обратите внимание, что я переместил код затухания внутрь полного обратного вызова .load() метод.

0

Другие решения

Других решений пока нет …

По вопросам рекламы [email protected]