第二个$(document).ready事件jQuery

6
我将使用一些外部jQuery并在$(document).ready()事件触发后插入广告,类似于以下代码:
$(document).ready( function() {
  $('#leaderboard').html("<strong>ad code</strong>");     
});

这是为了防止广告加载缓慢而导致UI被阻塞。到目前为止,它一直运行良好。

现在我需要通过我们的CMS系统插入更多广告,但这不能作为外部JS文件的一部分,所以我想知道能否使用第二个文档就绪事件并使用内联脚本标记进行插入?如果可以,外部JS文档准备就绪事件先执行还是内联脚本呢?

5个回答

10

您可以使用任意数量的事件方法,jQuery 会将它们加入一个队列中。方法调用顺序与定义顺序相同 - 最后添加的最后调用。

另外一个有用的功能是,您可以使用Ajax加载HTML代码,并且在代码加载到DOM中时也会调用$().ready(),因此您可以动态地加载广告。


9

是的,添加多个 $(documents).ready() 并不是问题。所有的事件都将在就绪事件上执行。

然而请注意,您提供的代码示例是错误的。$(document).ready() 接受一个函数,而不是一个表达式。因此,您应该像这样提供一个函数:

 $(document).ready( function() {
  $('#leaderboard').html("<strong>ad code</strong>");     
 });

当文档准备好时,该函数将被执行。


哎呀,是的,我只是拿了一些代码来说明我正在做的事情是否真的有效 :) - Tom

6
这是一个关于多个文档就绪事件的小教程,点击这里查看。

3

使用jQuery的好处之一是可以有多个ready()定义。这对于所有jQuery事件都适用。

$(document).ready(function () { alert("第一个"); });

$(document).ready(function () { alert("第二个");


1
JQuery 按照定义的顺序调用 ready 函数。如果您想要先加载一些数据并延迟执行,请使用 holdReady()

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接