javascript - 如何判断一个html div元素是否加载完成

Question

单击 jsp (1.jsp) 中的加载按钮时，另一个 jsp(2.jsp) 将加载到原始 jsp(1.jsp) 的 div 元素中。这个加载的 div jsp 有一些大的数据表和 html 元素，需要时间来配置(几秒钟)。在这段时间内，向用户显示一个加载对话框或等待屏幕会很有用，因为 jsp 还没有完全准备好。我尝试使用 jquery 模态以及 jquery 显示/隐藏，如下所示

   $("#loadpage").show();       
   $("#divElement").load("2.jsp");               
   $("#loadpage").hide();

但问题是 hide() 在 2.jsp 完全加载之前被调用。如何保持加载 gif 直到 2.jsp 完全加载？？？？

Answer 1

使用加载函数的回调函数就可以了

 $("#divElement").load("2.jsp", function () {
     $("#loadpage").hide();
 });

Callback Function If a "complete" callback is provided, it is executed after post-processing and HTML insertion has been performed. The callback is fired once for each element in the jQuery collection, and this is set to each DOM element in turn.

有关更多信息，您可以查看 JQuery Documentation of load

编辑(评论后): 如果你想检查错误，你可以通过以下方式实现该功能:

function(response, status, xhr) {
    if (status == "error") {
        // Do something on error
    } else {
        $("#loadpage").hide();
    }
}