使用Javascript触发器加载所有元素

Question

我通过此代码加载了2个外部html页面：

<div id="header-div"></div>

<div id="footer-div"></div>

我的js文件包含以下内容：

$(function () {
    $("#header-div").load("/AfekDent/header.html");
    $("#footer-div").load("/AfekDent/footer.html");
});  

创建头文件中的特定元素时，我想运行一个函数-我可以使用哪个触发器？

可以，当所有元素都被加载时，触发器就会发生。

谢谢！

Answer 1

在您的load()调用中添加一个回调。

$(function () {
    $("#header-div").load("/AfekDent/header.html", function() {
        console.log('My header was loaded!');
    });
});

Answer 2

您可以在#header-div上使用回调，该回调将在加载整个标头后执行代码。

$("#header-div").load("AfekDent/header.html", function() {
  someFunction();
});

但是，如果要在头文件中的特定元素加载后执行代码，请尝试以下操作：

$("#specific-element").on("load", function() {
  someOtherFunction();
});

如果您想了解有关load和on("load")之间的区别的更多信息，请查看此问题或阅读jQuery文档中的load和on（） 。

为简单起见，我建议使用$(document).ready(function() {yetAnotherFunction();});执行代码$(document).ready(function() {yetAnotherFunction();}); ，但这取决于您的具体情况。