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/