基于jQuery中的选择器动态地向元素添加属性

Question

我坚持使用一些基于jQuery的库，它迫使我在我的标记中为很多元素添加一个属性，以便它“不引人注意地”为我做一些AJAX的表单发布，好像它们没有我还在字典中查看“不显眼”的含义。

在尝试从外部戳到所述库以更改它正在使用的选择器之后，我放弃了，现在我尝试使用jQuery添加属性，以便我可以使它实际上不引人注目。

如果我这样做：

$('form.filter, .pagination a, .sortable a').attr('data-remote', true);

这会修复执行时的每个元素。问题是AJAX查询替换页面的部分，然后包含更多应添加属性的元素。所以我发现第一次点击有效，但是第二次点击不使用AJAX加载页面，此时循环重复，因为整个文档已经被重新加载。

我模糊地认为on()就是出于这种情况，但是我尝试了多种使用它的方法，但是没有一种方法可以解雇（我有一个alert因此我会找出它的确如何。）

这样做的正确方法是什么？

Answer 1

不幸的是，.on()在这里无济于事。这只对事件委派有用。

你应该只是咬紧牙关并直接包含属性。

---

如果您坚持，可以使用DOM Mutation Observers进行此操作。

对于旧版浏览器，您必须使用旧的DOM Mutation Events，现已弃用。

---

有关这两种方法的解释，请阅读本文：

Detect DOM changes with Mutation Observers

Answer 2

您最好的选择是找到表单发布的成功回调，并在那里包含您的属性赋值。您还可以使用全局ajax成功回调，正如Floris通过添加

所述

$(document).ajaxSuccess(function() { 
    $('form.filter, .pagination a, .sortable a').attr('data-remote', true);
});