dom - Accessing dynamically embedded HTML elements with jQuery in WebKit -
i've been searching morning , can't find solution this.
i'm developing web application lot of lazy-loading. clicking link ajaxly replaces content in divs create single page experience.
at points, embedded content has links embed dynamically added element. works fine in firefox, chrome , safari unable see dynamically added. logging returns undefined.
it's done via plugin wrote handle loading modular content. lots of options supplied via data- attributes.
basic html code:
<a href="someurl" data-target="#content" data-partial="#content">embed content</a> <div id="content"><!-- contents replaced link above --></div>
result after clicking first link:
<a href="someurl" data-target="#content" data-partial="#content">embed content</a> <div id="content"> <a href="anotherurl" data-target="#morecontent" data-partial="#morecontent"><embed more content</a> <div id="#morecontent"><!-- contents replaced link above --></a> </div>
in firefox, clicking second link replaces contents of #morecontent - not in chrome or safari.
you can see example here:
http://www.hants.gov.uk/ajax/libs/modular/demo/respomsivedemo.html
plugin code associated click (gets fired in instances):
$.ajax({ url: 'someurl', cache: false, success: function (data) { data = $(data).find(_settings.partial).html(); //in firefox these show element ids. in chrome/safari - undefined console.log('_settings.target: '+_settings.target.attr('id')); console.log('target in dom: '+$('body').find(_settings.target).attr('id')); _settings.target['html']($(data)); } });
i haven't posted full set of code, know that:
click events being added newly inserted links, , firing successfully. ajax content being fetched in instances. ajax content being filtered relevant element using $(data).find() firefox able insert new content element didn't exist when page first loaded.
i've looked @ using .on() - works events , can't see anywhere add checks dom mutations in plugin.
Comments
Post a Comment