jQuery 1.7 .on() 호버를 만드는 방법은 무엇입니까?

Question

마우스를 올리면 동적으로 생성 된 요소에 문제가 있습니다. 새로 만든 html 요소를 가리키면 작동하지 않습니다. 아직 여기 http://api.jquery.com/on/ 같이

$('.hover').on({ 
    mouseenter : function() { 
     alert('you hovered the button!'); 
    }, 
    mouseleave : function() { 
     alert('you removed the hover from button!'); 
    } 

}); 

하지만 행운 : 나는 심지어이 코드를 시도

var createBtn = $("#create"); 

createBtn.click(function() { 
    $('div').append('<button class="hover">new hover button</button'); 
    return false;   
}); 


$('.hover').hover(function() { 
    alert('you hovered the button!'); 
}, function() { 
    alert('you removed the hover from button!'); 
}); 

:

<button id="create">create new button</button> 
<button class="hover">hover me</button> 
<div></div> 

jQuery를 :

여기 내 HTML 코드입니다. 데모 : http://jsfiddle.net/BQ2FA/

Answer 1

올바른 구문이 아닙니다. 동적으로 '.hover'요소 생성이이 이벤트를 수신 할 수

사용 : 당신은 직접적인 바인딩에 대한 .on를 사용하는

$(document).on('mouseenter', '.hover', function(){ 
     alert('you hovered the button!'); 
}).on('mouseleave', '.hover', function() { 
     alert('you removed the hover from button!'); 
}); 

Answer 2

을, 당신은 위임을 사용할 필요가 :

$('div').on({ 
    mouseenter: function() { 
     alert('you hovered the button!'); 
    }, 
    mouseleave: function() { 
     alert('you removed the hover from button!'); 
    } 
}, ".hover"); 

http://jsfiddle.net/BQ2FA/2/