javascript - Newly added dom elements not being selected -
i have image list has ability load more content via ajax. on default there images loaded list. when user scrolls 4 items added list. list refreshed via ajax every 15 seconds , replaces top 7 items in list. problem when 4 new items added list selector seems ignore items, doesn't select 0 index.
i know sounds confusing i'll try , demo simple example.
ex
$(function () { // update channelstats settimeout(function () { var refresh = setinterval(updatechannels, 15000); updatechannels(); }, 15000); function updatechannels() { $.ajax({ type: "post", url: "ajax/imagelist.aspx/updateimages", data: "{}", contenttype: "application/json; charset=utf-8", datatype: "json", success: function (data) { // newest var $newestresults = $('#newest .pcvideomaincontainer:lt(7)'); $newestresults.fadeout('slow'), function () { remove() }; $.each($newestresults, function (index, value) { $(this).delay(index * 250).animate({ opacity: 0 }, 250, function () { $(this).remove(); $('#pccontentholder_newest').append(data.d.newest.htmlchannelsegments[index]); }); }); }); } });
[note order of numbers - order images loaded]
on initial page load first images loaded
ã1. on initial page load following images loaded
1 2 3 4 5 6 7
ã2. when user scrolls remaining images shown
1 2 3 4 5 6 7 8 9 10 11
ã3. update script runs 1st time
8 9 10 11 1 2 3 4 5 6 7
ã4. update script runs 2nd time
4 5 6 7 1 2 3 4 5 6 7
ã5. each , every subsequent time update script runs order is
4 5 6 7 1 2 3 4 5 6 7
from can tell 4 newly added elements not included in $('#newest .pcvideomaincontainer:lt(7)')
selection. i'm not sure how use "live" in scenario, or if there other technique.
i'm not sure if main problem or not, part of code missing $(this).
before remove()
, missing closing paren. have this:
var $newestresults = $('#newest .pcvideomaincontainer:lt(7)'); $newestresults.fadeout('slow'), function () { remove() };
it should this:
var $newestresults = $('#newest .pcvideomaincontainer:lt(7)'); $newestresults.fadeout('slow'), function () { $(this).remove() });
once fix this, $newestresults dom objects removed i'm unsure why try operate on them again following lines of code.
Comments
Post a Comment