How can I clone a node, copying the data but not the event handlers?

Question

jQuery's clone function looks like this:

.clone( [withDataAndEvents ] [, deepWithDataAndEvents ] )

withDataAndEvents: A Boolean indicating whether event handlers and data should be copied along with the elements.

deepWithDataAndEvents: A Boolean indicating whether event handlers and data for all children of the cloned element should be copied.

Both of these parameters affect data and events. Would it be possible to keep only the data, but not the events? Basically, my ideal clone function would look like this:

.idealClone( [withData] [, withEvents ] [, deepWithData ] [, deepWithEvents ] )

withData: A Boolean indicating whether data should be copied along with the elements.

withEvents: A Boolean indicating whether event handlers should be copied along with the elements.

deepWithData: A Boolean indicating whether data for all children of the cloned element should be copied.

deepWithEvents: A Boolean indicating whether event handlers for all children of the cloned element should be copied.

Is there any way to acheive this?

NB I'm working with 1.8.1, but answers for all version are welcome

Answer 1

You can easily extend the jQuery object with your ideal clone method, and use various combinations of data and off to keep only the things you want. Personally I think it's easy enough to just do:

// clones with data and events, then unbinds all events (bound with .on)
$(element).clone(true).off();