Jquery – 如何在动态创建后添加事件

我正在动态创建div，然后将其附加到容器：

var str = '
'; $('#fpdiv').append(str); 

现在我需要添加一个hover甚至这些div。 我试图引用它，但后来发现我需要考虑.on（）。 我试过这个（之前）：

 $('#'+dim.src).hover(function{},function{}); 

但正如所料，这不起作用。 我也试过这个：

 $('#'+dim.src).on('hover','(function{},function{})'); 

但似乎无法使语法恰到好处。 有人可以帮忙吗？ 提前致谢。

Answer 1

你可以试试这个

 var str = $('
', { text:'Hello', class:'dimsdiv', id:'dim_src', style:'cursor:pointer', mouseenter:function(){ ... }, mouseleave:function(){ ... } }); $('#fpdiv').append(str); 

同时删除. 从dim.src ，而不是使用dim_src作为id ，它在jQuery中用作class选择器，不知道为什么你使用它，但$('#'+dim.src)无效。

演示 。

Answer 2

您可以使用委托事件方法并将hover事件（即mouseenter和mouseleave ）绑定到具有类“dimsdiv”的动态创建元素和具有ID “fpdiv”的父元素：

 $("#fpdiv").on({ mouseenter : function() { // hover on }, mouseleave : function() { // hover off } }, ".dimsdiv"); 

Answer 3

 .on('hover',' has been deprecated in the latest jQuery version.. 

您需要使用委托事件来执行此操作。将事件添加到父容器。

第二种方法是在创建元素后添加事件

 $(function() { var addEvent = function() { $('.dimsdiv').unbind().hover(function {}, function {}); } // Lets say you are creating your div's here $('#btn').on('click', function() { // Create Div var str = '
'; $('#fpdiv').append(str); // Call the function here addEvent(); }); });​ 

Answer 4

在1.8中删除了on的速记hover别名。 您可以改用hover()方法。 它接受一个或两个函数作为参数来处理hover和hover事件。

 $('#'+dim.src).hover( function () { // hover in code here }, function () { // hover out code here } ); 

Answer 5

你需要的是一个实时function，所以你可以设置一次，它会影响你的动态HTML。

http://api.jquery.com/live/