Question

我知道JQuery可以使用.on和.live (deprecated)，但是这些假设您希望将事件处理程序附加到动态添加元素的一个或多个事件中，而我不这样做。我只需要引用它，这样我就可以访问它的一些属性。

更具体地说，有多个这样的动态元素都设置了class="cluster"，并且每个动态元素都有不同的值：title属性，top属性和left属性。

这些jquery选项都不起作用：

var allClusters = $('.cluster');
var allClusters2 = $('#map').children('.cluster');
var allClusters3 = $('#map').find('.cluster');

同样，我不想附加任何事件处理程序，所以.on似乎不是正确的解决方案，即使我要劫持它，添加一个虚假事件，一个doNothing处理程序，然后只是引用我的属性。
必须有一个更好的解决方案。有什么想法吗？

更新
我错误地说了标题，因为我的意思是说元素是动态添加到DOM的，而不是通过JQuery。标题已更新。

Answer 1

我明白了。元素没有显示，因为 DOM尚未更新。

我正在使用Google地图和MarkerClustererPlus提供更多上下文，当我使用markerclustererplus添加地图标记时，在添加后的javascript代码中无法使用它们。

在我的谷歌地图中添加google maps event listener修复了问题：

google.maps.event.addListener(myMarkerClusterer, 'clusteringend', function () {
    // access newly added DOM elements here
});

一旦我添加了该监听器，所有上述JQuery选择器和/或方法都可以正常工作：

var allClusters = $('.cluster');
var allClusters3 = $('#map').find('.cluster');

虽然这个没有，但那是因为它只找到了父母的直接后代：

var allClusters2 = $('#map').children('.cluster');

Answer 2

在ajax回调中做你需要做的事情：

$.ajax(...).done(function (html) {
   //append here
   allClusters = $('.cluster');
});

如果您希望它们是分开的，您可以在事后绑定处理程序，或使用$.when：

jqxhr = $.ajax(...).done(function (html) { /* append html */ });
jqxhr.done(function () { allClusters = $('.cluster') });
$.when(jqxhr).done(function () { /* you get it */ });

如果在没有ajax更改的情况下附加这些更改，则只需将cluster - 查找代码移动到DOM更改发生的位置。

如果这不是一个选项，那么我想你只需要检查一个间隔。

如何在DOM加载后引用动态添加的元素而无需对任何事件进行操作？

2 个答案: