javascript - Event binding on dynamically created elements? -


I have a little code, where I'm looping through a selection box on a page and a I'm compulsive. Mouse On / Off

The problem I have is that after the initial loop, whatever box I add through AJAX or DOM, the event will not be bound.

I have found this plugin (), but before I get 5k on my pages with any other plugin, I want to see if anyone knows a way to do this, either with jQuery Or from any other option.

should use jQuery 1.7 :

  $ (staticAncestors) .on (eventName, dynamicChild, function () {});  

Before , the recommended approach was to use:

  $ (selector) .live (eventName, Function () {});  

However, live was exempted in 1.7 in favor of , and completely in 1.9 Was removed. Live () Signature:

  $ (selector) .live (eventName, function () {});  

... can be replaced with the following signature:

  $ (document) .on (eventName, selector, function () {}) ; For example, if your page was dynamically creating elements with the class name  dosomething , then you will force that event with a parent who already exists, often  Document . 

  $ (document) .on ('mouseover mouseout', '.dosomething', function () {// what to do when you want to have mouseover and mouseout // elements Match that '.dosomething'});  

Any parent who is present at the time of the incident is fine. For example

  $ ('.button'). ('Click', 'button', function () {// do something here});  

  & lt; Div class = "buttons" & gt; Will apply. & Lt ;! - & lt; Button & gt; That is dynamically generated and added here - & gt; & Lt; / Div & gt;  

Comments

Popular posts from this blog

python - Overriding the save method in Django ModelForm -

html - CSS autoheight, but fit content to height of div -

qt - How to prevent QAudioInput from automatically boosting the master volume to 100%? -