将元素追加到另一个元素后的jQuery双击事件

Question

I'm using agile toolkit, a framework that generates javascript code from PHP. I have a div element (I'll call it "top-element") that contains some other div elements, some buttons. I want to move the "top-element" to another element, to change it's parent.

I tried something like:

$('#top-element').appendTo($('#new-parent'));

But the problem is that the "top-element" have some childrens that have click events, some buttons. After I append the "top-element" to a new element (after changing it's parent), the click events are triggered twice.

I tried to clone the element and append the cloned element to the new parent:

var cloned_top_element = $('#top-element').clone(true);
cloned_top_element.appendTo($('#new-parent'));

I got the same problem, the click event on "top-element" childrens was called twice.

The way to prevent double click is to use:

unbind('click') or off('click')

I tried something like:

$('#new-parent').find('.children-class').unbind('dblclick').unbind('click');

But still no results.

The binding for child buttons is like this:

$('.children-class').bind('click',function(ev){ ev.preventDefault();ev.stopPropagation(); other stuff });

The bind function appears only once. There aren't duplicates in the js code.

Any ideas? Anticipated thanks.

Answer 1

Remove the true in the clone function .clone(); this will not copy the event handlers