How to rebind event to dynamic created elements in jquery plugin?

Question

I am creating a plugin and got something problems:

in the case:

I have a list of un-list created by ajax loaded .such as :

<ul id='ulist'>
    <li>list 1</li>
    <li>list 2</li>
    <li>list 3</li>
</ul>

then li were binded with hover event when they loaded. such as :

$('ul').bind('hover',function(){});

but my plugin had a function to dynamic adding new li item to the ul[id='ulist'] which had been loaded.and the new li didn't get the hover event binding.Such as:

addNewLi : function(){
    $('<li />').html('item N').appendTo('#ulist');
}

So,I knew I should bind the new dynamic created elements by 'live',but I don't know where to put it or have other way ....

Thank you very much!!

lonesomeday · Accepted Answer · 2011-01-09 16:37:16Z

1

You can't use the twin handler functionality of hover in live or delegate. That functionality is, I believe, planned for jQuery 1.5.

However, hover is actually only a shortcut for the two events mouseenter and mouseleave, so it's actually very easy to mimic the functionality using these events.

Example using delegate:

$('#ulist').delegate('li', 'mouseenter', function() {
    // code for mouseenter
}).delegate('li', 'mouseleave', function() {
    // code for mouseleave
});

edited Jan 9, 2011 at 16:37

answered Jan 9, 2011 at 15:33

lonesomeday

239k54 gold badges330 silver badges329 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

user113716 Over a year ago

You can use 'hover' with live/delegate, but you just can't pass it 2 functions. Instead you need to test for the event type. Still +1 on the delegate solution.

qinHaiXiang Over a year ago

work fine for me!! Thank you very much! You gave me another way to code my plugin!!

Collectives™ on Stack Overflow

How to rebind event to dynamic created elements in jquery plugin?

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related