Question

我正在尝试在加载时更改一组div块的css。以下代码工作得很好。但是，只有在用户单击div时才会进行更改。如何在不需要用户干预的情况下自动触发更改？换句话说，我应该用哪些事件来实现我的目标。

$("body").delegate(".shortTopicInfoHolder", "click", function()
{
       $(".shortTopicInfoHolder").toggleClass("shortTopicInfoHolderRTL");
});

我正在尝试使用委托来确保更改仍然存在。尝试在文档准备好时直接切换类，但是对于在更改后创建的div块不起作用。

Answer 1

如果您在页面加载时这样做，为什么不使用$(document).ready()？在完成DOM加载时调用它：

$(document).ready(function() {
    $(".shortTopicInfoHolder").toggleClass("shortTopicInfoHolderRTL");
});

Answer 2

就像Emmanuel提到的那样，您可以使用ready callback，或者如果您正在寻找定时事件，那么您可以使用：

$(function() {
    setTimeout(function() { 
        $(".shortTopicInfoHolder").toggleClass("shortTopicInfoHolderRTL");
        $("body").delegate(".shortTopicInfoHolder", "click", function() {
            $(".shortTopicInfoHolder").toggleClass("shortTopicInfoHolderRTL");
        });
    });
});

Answer 3

正如其他答案所述，准备好的代码将正确设置初始负载。

如果将来会有更多负载，您可能需要修改回调函数以触发类切换。

没有更改DOM的事件。

Answer 4

在委派后立即触发点击事件

$("body").delegate(".shortTopicInfoHolder", "click", function()
{
       $(".shortTopicInfoHolder").toggleClass("shortTopicInfoHolderRTL");
});
$('.shortTopicInfoHolder').trigger('click');

除了click之外的委托的jQuery事件

4 个答案: