jQuery AJAX - 创建DOM元素

我在jQuery中使用AJAX和PHP获取新帖。然后创建一个新的div并将其添加到它。jQuery AJAX - 创建DOM元素

这里是我的代码：

function getMorePosts(latestPost){ 

    $.ajax({ 
     type: "POST", 
     url: "/includes/classes/handler.php?do=getMorePosts", 
     data: "&latestPost="+latestPost, 
     cache: false, 
     success: function(data){ 
      if(data){ 
       $('#addUpdate textarea').val(''); 
       $('<div id="newPosts"></div>').insertAfter('.myDeskAdd'); 
       $(data).prependTo('#newPosts'); 
      } 
     } 
    }); 
    return false; 
}

现在，数据是所有的HTML代码从我handler.php。一切正常，它是附加的，我可以在屏幕上看到结果。这是正确的 - 很好！

但这里是我的问题：当它添加到屏幕上，它就像我不能“使用”的DOM元素。例如：我有一个图像，我可以点击，然后它必须从jQuery调用一个警报，但事实并非如此。而绑定到创建的dom元素的所有其他jQuery效果都不起作用。

这些元素不工作，如果我按F5确实工作。

我试过html(),prepend(),append()等等。

来源

2012-03-14 skolind

你必须重新绑定的事件处理程序的内容被附加到页面后。或者查看jQuery的'on'来委派事件。 – 2012-03-14 13:02:23

如何重新绑定事件处理程序？我会看看 – skolind 2012-03-14 13:03:49

所有动态内容（从ajax加载），绑定方法使用jQuery在。那么它应该工作

，而不是这个，

$(".imageClass").click(function(){ 
    alert($(this).html());  
});

使用此

$(".yourContainerDiv").on("click", ".imageClass", function(event){ 
    alert($(this).html());  
});

http://api.jquery.com/on/

来源

2012-03-14 13:04:28 Shyju

我会完全删除我的正常click（）方法，并用.on（）替代它吗？或者我应该在我的函数getMorePosts（）中使用on（）。？ – skolind 2012-03-14 13:16:37

是的。用代码替换。 – Shyju 2012-03-14 13:31:24

但是，当点击星形图标时，我不需要将处理程序绑定到元素。我需要通过ajax函数将处理程序绑定到新加载的元素。我会怎么做？ – skolind 2012-03-14 13:34:12

您需要使用live()或on()使用适当的参数将事件绑定到新添加的DOM元素。

来源

2012-03-14 13:03:28

live（）已被弃用 – Starx 2012-03-14 13:04:33

除非你使用事件委托，事件处理程序仅适用于存在当代码绑定它们运行，所以任何动态地添加元素以后将不会有事件处理程序的约束，你的功能将无法正常工作元素。

看看在.on()（jQuery的1.7+）或.delegate()（之前的jQuery 1.7）的事件委派的详细信息的功能。

来源

2012-03-14 13:04:02

当动态生成元素时，它们不会附加到以前的事件处理程序。

您必须使用。 on()方法委托事件处理程序。

例子：

$(".yourmajoreventhandler").on('click', function() { 
    //do your stuff 
});

代表团举例：现在

$("body").on('click', ".yourmajoreventhandler", function() { 
    //do your stuff 
});

，每一次，你生成yourmajoreventhandler类元素的上述功能将运行。

来源

2012-03-14 13:04:04 Starx

'.on（）'的使用不会设置事件委托，这是动态生成内容所需的。 – 2012-03-14 13:05:10

@AnthonyGrist，它的确如此。在评论之前，你为什么不做研究？ '$（元素）。在（ “点击”， “选择”，函数（）{}）;' – Starx 2012-03-14 13:17:10

@AnthonyGrist，看看[这里]（http://jsfiddle.net/Starx/TSqbs/1/）演示从我的另一个答案来证明我的观点 – Starx 2012-03-14 13:23:01

事件如何绑定到要添加的DOM元素？他们是元素的属性还是你使用jQuery绑定它们？如果它是前者，则需要发布更多代码，但我猜测它是后者，在这种情况下，您将需要使用jQuery's on method来绑定您的事件。

当您绑定的事件它仅适用于当前存在的元素。他们不会传播到新的元素。使用on()方法通过绑定到所有新元素来解决此问题。

来源

2012-03-14 13:04:12 jasonlfunk

jQuery AJAX - 创建DOM元素

回答

相关问题