Event delegation in jQuery 1.4

I have the following code:

$("ul.relatedAlbums li").hover(function(){
    $(this).css({fontWeight:"bold"});
},
function(){
    $(this).css({fontWeight:"normal"});
});

I heard good things about event delegation and speed of performance. Using the jQuery delegate method, I assume it will look something like this:

$("ul.relatedAlbums").delegate("li", "hover", function(){
    $(this).css({fontWeight:"bold"});
},
function(){
    $(this).css({fontWeight:"normal"});
});

But reading the documentation, he says that this method is similar to using a live event. And I always understood that a live event is ineffective. So, can someone out there enlighten me on best practices for this?

+3
source share
3 answers

Just to indicate .delegate () actually uses .live () inside for the time being and depriving .live () will mean some framework effort.

, ..live() .delegate , , .

EDIT: downvoters: jQuery: http://forum.jquery.com/topic/depreciating-live :

delegate: function (, , , fn) {       return this.live(, , fn, );   },

, , , .delegate() , " ". , .delegate() , .

? , li, OP .delegate() . #selector , , .

+2

, , . event.target

, JavaScript?

- , , , , , .

JavaScript:

?

,

?

.

<div id="container">
<ul id="list">
    <li><a href="http://domain1.com">Item 1</a></li>
    <li><a href="/local/path/1">Item 2</a></li>
    <li><a href="/local/path/2">Item 2</a></li>
    <li><a href="http://domain4.com">Item3</a></li>
</ul>
</div>

#list, . click , .on():

// attach a directly bound event
   $( "#list a" ).on( "click", function( event ) {
    event.preventDefault();
    console.log( $( this ).text() );
    });

, . , , , :

// add a new element on to our existing list
 $( "#list" ).append( "<li><a href='#'>Item 5</a></li>" )

, . - , . .on(). , , .on(), .

, , :

// attach a delegated event
$( "#list" ).on( "click", "a", function( event ) {
event.preventDefault();
console.log( $( this ).text() );
});

, .on(). , , , . , . , . , , , .

?

, - .

, ! : http://www.scriptcafe.in/2014/03/what-is-event-delegation-in-jquery.html

+1

, .

.live() , , , , , , , .

, , .

, .delegate(), , .live(), .

:.live() . , ..delegate() - , .

0
source

Source: https://habr.com/ru/post/1751670/


All Articles