JQuery .load 回调在加载脚本中的 .ready 回调之前调用，初始化加载脚本的正确方法是什么？

Question

在按钮单击的主文档中，我正在加载一些 div 的内容

$("#my_div").load(function() {
    alert("Loaded");
});

加载的内容只是脚本

<script>
alert("Init outside");
$(document).ready(function() {
    alert("Init inside");
}
</script>

警报顺序是“Init outside”、“Loaded”、“Init inside”。

我是否正确，这是在脚本正文中初始化加载脚本的正确方法，这意味着alert("Init outside") 所在的位置？不在.ready() 处理程序中？

因为在我的实际工作流程中，我肯定需要在处理 .load() 回调之前初始化脚本。在.load() 回调中，我正在显示加载的模式，但在此之前，模式应该自行初始化，即设置on('show.bs.modal') 处理程序等。

很奇怪，如果我需要这样的序列，初始化应该发生在$(document).ready()处理程序之外，所以这就是我问的原因。

UPD：这个问题不是重复的，因为它更多地与 JQuery 定义的初始化和回调序列相关。

Answer 1

这在一定程度上取决于您在模态初始化步骤中所做的事情，但如果没有异步元素，您不需要将初始化代码和实际显示它的代码放在单独的回调中。如果代码块在不同事件的回调中，那么首先运行的代码块存在歧义 - 您想确定它们是否会按顺序运行。

例如：

$(document).ready(function() {
  $('#modal').on('show.bs.modal', function() {
    // your init code
  });

  $('#modal').modal('show');
}

如您所述，将回调绑定到show.bs.modal 事件是一个同步操作，因此代码可以放在同一个块中。 .ready() 只是等待元素准备好（这就是你所需要的），而 .load() 等待所有内容被加载，但两者都将确保你的元素在它们的回调执行之前已经加载。