显示加载数据前阿贾克斯装载机 [英] Display Ajax loader before load data
本文介绍了显示加载数据前阿贾克斯装载机的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
朋友你好我想给特别的div数据加载之前阿贾克斯装载机，但问题是，数据是动态的到来同一页面上，但我的脚本从另一个文件调用的数据的script.php 请参见下文。
剧本
＆LT;脚本＆GT;
功能loadingAjax（div_id）
{
$（＃+ div_id）的.html（'＆LT; IMG SRC =AJAX-loader.gif＆GT;节约...'）;
$阿贾克斯（{
键入：POST，
网址：script.php的，
数据：名称=约翰和ID = 28，
成功：函数（MSG）{
$（＃+ div_id）的.html（MSG）;
}
}）;
}
＆LT; / SCRIPT＆GT;
HTML
＆LT;身体的onload =loadingAjax（'myDiv'）;＆GT;
＆LT; DIV ID =myDiv＆GT;＆LT; / DIV＆GT;
＆LT; DIV ID =XYZ＆GT;＆LT; IMG SRC =SS /图像/ abc.jpg/＆GT;＆LT; / DIV＆GT;
＆LT; /身体GT;
其工作正常，但我想加载数据的同一页，请帮我
在此先感谢....
修改
我要显示加载数据前装载机 #xyz 到 #myDiv
解决方案
您可以用下面的HTML尝试 -
＆LT;身体的onload =loadingAjax（'myDiv'）;＆GT;
＆LT; DIV ID =myDiv＆GT;
＆LT; IMG ID =载入图像SRC =AJAX-loader.gif的风格=显示：无;/＆GT;
＆LT; / DIV＆GT;
＆LT; /身体GT;
和脚本 -
＆LT;脚本＆GT;
功能loadingAjax（div_id）{
变种divIdHtml = $（＃+ div_id）的.html（）;
$阿贾克斯（{
键入：POST，
网址：script.php的，
数据：名称=约翰和ID = 28，
beforeSend：函数（）{
$（＃载入图像）显示（）。
}，
成功：函数（MSG）{
$（＃+ div_id）。html的（divIdHtml +味精）;
$（＃载入图像）隐藏（）;
}
}）;
}
＆LT; / SCRIPT＆GT;
Hello friends i want to show Ajax loader before Data load in particular div but problem is the data is coming dynamically on same page but my script calling data from another file Script.php please see my code below
Script
<script>
function loadingAjax(div_id)
{
$("#"+div_id).html('<img src="ajax-loader.gif"> saving...');
$.ajax({
type: "POST",
url: "script.php",
data: "name=John&id=28",
success: function(msg){
$("#"+div_id).html(msg);
}
});
}
</script>
HTML
<body onload="loadingAjax('myDiv');">
<div id="myDiv"></div>
<div id="xyz"><img src="ss/image/abc.jpg" /></div>
</body>
Its working fine but i want to load data in same page please help me
Thanks in advance ....
EDIT
I want to show loader before load data #xyz into #myDiv
解决方案
you can try with following html -
<body onload="loadingAjax('myDiv');">
<div id="myDiv">
<img id="loading-image" src="ajax-loader.gif" style="display:none;"/>
</div>
</body>
and the script -
<script>
function loadingAjax(div_id) {
var divIdHtml = $("#"+div_id).html();
$.ajax({
type: "POST",
url: "script.php",
data: "name=John&id=28",
beforeSend: function() {
$("#loading-image").show();
},
success: function(msg) {
$("#"+div_id).html(divIdHtml + msg);
$("#loading-image").hide();
}
});
}
</script>
这篇关于显示加载数据前阿贾克斯装载机的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
