在动态元素上初始化jquery插件

I have this code

我有这个代码

$(".address-geocomplete").geocomplete({
    country: "US",
    details: ".details",
    detailsAttribute: "data-geo"
});

It works with no problem when the elements were loaded with the document but it doesn't work when the element is called with ajax. I understand I could add the function to the ajax call but that's what I don't want. I would want to write this function once and for it to work no matter if the element was called on the document load or in ajax. Is that possible to do? How? Thanks

当元素加载文档时它没有问题,但是当使用ajax调用元素时它不起作用。我知道我可以将函数添加到ajax调用,但这是我不想要的。我想写一次这个函数,无论元素是在文档加载还是在ajax中调用,它都可以工作。这可能吗?怎么样?谢谢

1 个解决方案

#1

Use MutationObserver. You can use it to detect additions to the DOM. Watch the element to which the children are added, filter out the new child elements with class address-geocomplete and run your jQuery code on them.

使用MutationObserver。您可以使用它来检测DOM的添加内容。观察添加子项的元素,使用class address-geocomplete过滤掉新的子元素,并在其上运行jQuery代码。

MutationObserver does not work on old IE versions (10 and older).

MutationObserver不适用于旧的IE版本(10及更早版本)。