Jquery ImageLoader显示的时间不超过1秒

我正在使用jquery显示一个图形，加载它需要6到7秒，所以在这段时间内我必须显示图像加载程序。在这种情况下，图像加载程序必须在图形加载之前至少显示5秒，但其显示时间仅为1秒

JS:

$（函数（）{
/**图像加载器显示一秒钟*/
$（'#graph'）.html（''）；
$（'#graph'）.load（函数（）{
//图形数据
}); 
}); 

HTML:

$（文档）.ready（函数（）{
$（'#graph'）.html（''）//图像加载程序显示
setTimeout（函数（）{
$（'#graph'）.html（'Loaded'））
},5000);
}); 

$（文档）.ready（函数（）{
$（'#graph'）.html（''）//图像加载程序显示
setTimeout（函数（）{
$（'#graph'）.html（'Loaded'））
},5000);
}); 

图的内容立即被.load（）方法替换。我建议您创建一个loader div，例如

.graphLoader

，然后将图形数据加载到一个隐藏的

#graph

div中，然后在加载完成的同时取消隐藏

#graph

下面是一个关于JSFIDLE的工作演示

CSS:

HTML:

#graph的内容立即被.load（）方法替换。我建议您创建一个loader div，例如

.graphLoader

，然后将图形数据加载到一个隐藏的

#graph

div中，然后在加载完成的同时取消隐藏

#graph

下面是一个关于JSFIDLE的工作演示

CSS:

HTML:

---

谢谢你的回答。我不能在这里使用setTimeout函数，因为如果网络速度慢，图形可能需要10到15秒以上。谢谢你的回答。我不能在这里使用setTimeout函数，因为如果网络速度慢，图形可能需要10到15秒以上的时间。

$(function () {
    /** image loader displaying for a sec */
    $('#graph').html('<img src="images/loader.gif">');      

    $('#graph').load(function() {
       //data of graph
    }); 
}); 

<div id="graph"></div>

$(document).ready(function(){ 
    $('#graph').html('<img src="images/loader.gif">'); // image loader displaying
    setTimeout(function(){ 
        $('#graph').html('Loaded')
    },5000);
}); 

.graphLoader {
    display:block;
}
#graph {
    display:none;
}

<div class="graphLoader">Graph loading...</div>
<div id="graph"></div>

$(document).ready(function () {
    $("#graph").load("someGraphURL", function () {
        $('#graph').toggle();
        $('.graphLoader').toggle();
    });
});