jQuery .hide（）不能在動態創建的元素上運行

Question

我想在我的容器中動態創建一些div元素。我用簡單的功能做到這一點：

function myFunction(volume){ 
for(var i = 1; i<= volume; i++){ 
$('.container').append("<div></div>"); 
} 

的問題是，產生的div元素沒有反應到我的jQuery .hide（）函數。有誰知道它爲什麼不起作用？對於手動和動態創建的元素，HTML看起來都很好。

我做的jsfiddle，但它有點太碎： http://jsfiddle.net/gQBen/

我.hide的（）函數調用

$('div').mouseenter(function() { 
if (run){ 
$(this).hide(3000, function() { 
result++; 
run = false; 
rewrite(); 
}); 
} 
}); 

阿隆解決它的評論：http://jsfiddle.net/arunpjohny/SM38C/1/感謝！

Answer 1

你應該使用event delegation爲

$(".container").on("mouseenter","div",function(e){ 

}); 

事件委派，您可以附加一個事件偵聽器，以父元素，這將觸發對所有選擇匹配的孩子，無論是現在存在，或者是那些孩子們未來增加。

Answer 2

使用的選項.onchange（）代替的onclick

$('select').on('change',function(){ 
myFunction(this.value); 
}); 

也增加價值的選項

<option value="4" >4</option> 

您還需要使用事件代表團動態添加元素

$(document).on('mouseenter','div',function() { 

DEMO

Answer 3

UPDATE

此問題已更新，以便

$(".container").on("mouseenter","div",function(e){ 
    if (run){ 
     $(this).hide(3000, function() { 
      result++; 
      run = false; 
      rewrite(); 
     }); 
    } 
});