1

我有一个动态加载表格的页面。我想检查是否有任何tds 包含关键字，并根据该关键字更改一些 CSS 样式。

第一次加载时一切正常，但是当表中发生变化时，我的函数不会被触发。

这是我的代码。第一个块运行良好，但第二个不？

 $( document ).ready(function() {
        $("tr td:contains('*')").each(function(){
            $(this).parent("tr").css({ "background-color": "red" });
            $(this).parent().children().css({ "background": "inherit" });
        });
    });

jQuery('body').on('change', '.content', function () {
    $("tr td:contains('*')").each(function(){
        $(this).parent("tr").css({ "background-color": "red" });
        $(this).parent().children().css({ "background": "inherit" });
    });
});
4

3 回答 3

1

如果我理解正确，您正在尝试侦听表本身的更改，这意味着内部 html 更改、添加的行等。

不幸的是，您没有看到change事件触发的原因是该事件仅value在元素的 更改时触发；表格、行和单元格没有这样的属性。

来自 jQuery 关于更改事件的文档，可在此处找到：

此事件仅限于元素、框和元素。对于选择框、复选框和单选按钮，当用户使用鼠标进行选择时会立即触发该事件，但对于其他元素类型，该事件会延迟到元素失去焦点为止。

它第一次工作的原因当然是因为你没有将它包装在change事件中。当您的就绪功能触发时，它会立即触发。您的选择器工作正常，当然，该表根本不会触发您正在寻找的事件。

我自己并没有亲自这样做，但是可以在这里看到在 SO 上找到的一个解决方案，它涉及设置一种轮询器，它会不断检查是否有任何变化。它还解释了如何设置自定义事件，您可以触发该事件，从而进一步将您的代码分成可管理的部分。

显然他们还讨论了使用 jqGrid，它有一个你可能也想考虑的刷新事件。

希望有帮助。

编辑

您可能还可以使用MutationObserver，其文档可以在这里找到，并且看起来像是在 SO 上使用它的一个很好的例子。在 SO 示例中，张贴者表示他们在早在 IE 7 的浏览器上对其进行了测试，但是根据this，MutationObserver它本身并不是 100% 兼容的（也许他使用了 polyfill），因此请确保正确测试它。

于 2013-10-02T14:32:43.920 回答
0

用 document.ready 包装 on change 函数

$(function(){
/*code*/
});
于 2013-10-02T12:45:18.480 回答
0

感谢大家的帮助，我找到了使用我在这里找到的自定义构建插件的解决方案：

jQuery 观察 div

它对我来说就像一个魅力！

于 2013-10-03T07:57:55.617 回答