Javascript JQuery-如何在加载div中的内容时显示微调器？

我有一个导航栏，里面有一些链接。单击任何链接时，它都会从导航栏旁边的div中相应的html页面加载内容。因为加载内容可能需要几秒钟的时间，所以我尝试在加载内容时显示一个微调器。以下是我尝试过的示例代码：

$( '.nav_link' ).click( function( e ) {
    $( '.div_content' ).html('');

    var link = $(this);
    setTimeout(function() {
        $( ".div_content" ).load( link.attr( 'ref' ) );
    }, 1000);

    $( '.spinner' ).show();  // show Loading Div

    setTimeout(function() {
        $( '.spinner' ).hide(); // hide loading div
    },1500);
});

上面的代码显示了微调器，它开始旋转，然后停止并冻结，直到加载内容。然后微调器消失，内容看起来很好。我需要让它继续旋转直到内容完全加载，而不是这个冷冻旋转器

---

有什么建议吗？

我终于找到了一个有趣的问题解决方案。在div中加载html内容时，使用GIF微调器图像将冻结，因此我使用了css创建的微调器，该微调器工作平稳，不会冻结。它可以按照解释创建。

我终于为我的问题找到了一个有趣的解决方案。在div中加载html内容时，使用GIF微调器图像将冻结，因此我使用了css创建的微调器，该微调器工作平稳，不会冻结。它可以按说明创建。

最有可能的解释是加载功能出错……请检查控制台！“但是内容没有出现”尝试用

.attr（'href'）

替换

.attr（'ref'）

你能在问题中包含

html

吗？最可能的解释是加载函数中有错误…检查控制台！“但是内容没有出现”尝试用

.attr（'href'）

替换

.attr（'ref'）

你能在问题中包括

html

吗？