Question

我正在使用自定义复选框样式和一个复选框，该复选框由javascript为Google Identity Toolkit动态生成。例如，我们添加这个div：

<div id="gitkitWidgetDiv"></div>

Google Identity Toolkit脚本为该div生成新的html。

我需要在HTML中添加一个类，这个类是由javascript添加的，没有用户的任何操作，我正在努力使其工作。例如，这是我的代码：

$("#gitkitWidgetDiv").on('ready', ".gitkit-sign-in-options label", function() {
    $(this).addClass('checkbox');
});

我已尝试为其他一些选项切换'ready'并使用livequery插件，但没有任何对我有用。如果我使用像'click'这样的活动事件，它可以正常工作，但是在页面加载时我无法弄清楚如何执行此操作。有人可以帮忙吗？谢谢！

Answer 1

Modern browsers（包括IE11）支持mutation obervers。您可以使用一个来监视将添加的div的父节点。添加div后，只需添加该类。

Answer 2

我在这里制作的东西在这样的烦人案例中派上用场，当你需要的元素完成加载时很难判断：https://gist.github.com/DanWebb/8b688b31492632b38aea

所以在包含该功能之后，它就像是：

var interval = 500,
    stopTime = 5000,
    loaded = false;
setIntervalTimeout(function() {
    if($('.dynanicElementClass').length && !loaded) {
       $('.dynanicElementClass').addClass('checkbox');
       loaded = true;
    }
}, interval, stopTime);

它并不完美，我确信那里有更好的解决方案，但在大多数情况下，它可以完成这项工作。

将类添加到动态生成的HTML中

2 个答案: