How to use attrchange on dynamically generated elements about attrchange HOT 10 CLOSED

The delegated event method (dynamic binding) won't work with the plugin as the plugin itself is not an event. The plugin captures the event triggered when an attribute is changed, normalize the data and trigger's a callback.

You should call the plugin after adding it to the DOM. For ex:
$('body').append('<p>My header<p>').attrchange(...

Let me know if it works for you.

from attrchange.

Thank you for your reply.

Unfortunately I am not in control of when the element is loaded. On a user input I am calling a JS that loads a video player, and sometimes, not all the time, there is a “companion banner” div that will show a display ad during the pre-roll ad attached to that player. I was hopping to be able to to detect if the companion div is loaded and when the display style changes to resize the video player. All of my searching seems to be pointing to using a timer that polls the page. As this feels like a hack, and I have never had good luck with JS timers I was hoping for a more elegant solution.

-N8

On Apr 9, 2014, at 2:23 PM, Selvakumar Arumugam <[email protected]mailto:[email protected]> wrote:

The delegated event method (dynamic binding) won't work with the plugin as the plugin itself is not an event. The plugin captures the event triggered when an attribute is changed, normalize the data and trigger's a callback.

You should call the plugin after adding it to the DOM. For ex:

$('body').append('

My header

').attrchange(...

Let me know if it works for you.

—
Reply to this email directly or view it on GitHubhttps://github.com//issues/11#issuecomment-40005675.

from attrchange.

Is you script loading the video player synchronous? I am not sure if it is feasible, but you could add attrchange in the script that is called after loading the video.

from attrchange.

Do you still have this issue?

from attrchange.

Thank you for following up. We still have th issue, what we are going to do is add in a call to the script that loads the video player. Unfortunately this is not a high priority for our player developer as she has a 1000 other things on her plate, so it might be a while before we get this functionality setup. Her workload was one of the reasons why I looking for a JS solution to watch for a change on a dynamically generated element (an element created after the DOM is ready).

-N8

On Jun 21, 2014, at 6:19 PM, Selvakumar Arumugam <[email protected]mailto:[email protected]> wrote:

Do you still have this issue?

—
Reply to this email directly or view it on GitHubhttps://github.com//issues/11#issuecomment-46767563.

from attrchange.

I am in the exact situation of ncavanagh. Do you guys already have a solution for this?

from attrchange.

It would be really easy If you can post a test case some where like http://jsfiddle.net

from attrchange.

Thank you for responding so fast. The fiddle I coded is almost identical to my source and I use a plugin that requires a lot of others. The difference from my code is basically that I use local images, not from flickr.

The JSFiddle: http://jsfiddle.net/csa1wgdq/6/ (Edited: changed version 4 to 6)

What happens is: when I click on some image, they are loaded dynamically in the #blueimp-gallery .slides, and the miniatures goes to #blueimp-gallery .indicator.

What I need is to listen to them (the dynamically added images), when they are added and when the user changes the fullscreen image (using the arrow buttons, sliding or through the indicators)

from attrchange.

Well, turns out I was able to modify one of those tons of plugins I am using to add the ".attrchange" in the proper place. Now it is warning me which image (in fullscreen) is the active.

Thank you for your time!

from attrchange.

Glad it worked for you. I wasn't able to get to any of the issues lately.

from attrchange.