Home  >  Article  >  Web Front-end  >  jQuery Clone Bug solution code_jquery

jQuery Clone Bug solution code_jquery

WBOY
WBOYOriginal
2016-05-16 18:13:40943browse

First of all, when binding jQuery events, all events are stored in $.cache using the $.data() method, and they can be obtained repeatedly using data('events'):

Copy code The code is as follows:

var $div = $('div.demo'), data = $div.data();
// Get all binding events:
var events = data.events;
// Except for the special binding events of the window object:
var windowEvents = $(window).data('__events__' ; 🎜> The code is as follows:

var clickHandler = function(){
console.log('click test'); BUG example




Copy code


The code is as follows:




BUG source




Copy code


The code is as follows:

// event.js, jQuery.event.add:
// jQuery 1.4.1
handlers = events[ type ] = {}; // jQuery 1.4.2 handlers = events[ type ] = []; // manipulation.js, jQuery.clone : , cloneCopyEvent(): for ( var type in events ) { for ( var handler in events[ type ] ) { jQuery.event.add( this, type, events[ type ][ handler ], events[ type ][ handler ].data );
}
}


After 1.4.2, events[type] is an array, and the for...in loop will get all the methods extended on the array prototype, and then bind them to the DOM object.
Solution
Do not extend the array prototype and do not use the clone(true) method.
hasOwnProperty check.
Use each loop:




Copy code


The code is as follows:


var self = this;
for ( var type in events ) {
jQuery.each(events[ type ],function(idx,evt) { jQuery.event.add( self, type, evt.handler, evt.data ; > The code is as follows:
jQuery Clone Bug




Return
click me







Online demo /js/jquery_clone_bug/jQuery_clone_bug_demo.htm
Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Previous article:jQuery study notes DOM object and jQuery object_jqueryNext article:jQuery study notes DOM object and jQuery object_jquery

Related articles

See more