ajax - 在加载数据之前显示 Ajax 加载器

标签 ajax jquery

你好, friend 们,我想在特定 div 的数据加载之前显示 Ajax 加载程序,但问题是数据是在同一页面上动态传入的,但我的脚本从另一个文件 Script.php 调用数据,请查看我的代码下面

脚本

<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>

它工作正常,但我想在同一页面加载数据,请帮助我

提前致谢......

编辑

我想在将数据#xyz加载到#myDiv之前显示加载程序

最佳答案

您可以尝试使用以下 html -

<body onload="loadingAjax('myDiv');">
    <div id="myDiv">
        <img id="loading-image" src="ajax-loader.gif" style="display:none;"/>
    </div>
</body>

和脚本 -

<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> 

关于ajax - 在加载数据之前显示 Ajax 加载器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11515994/

相关文章:

javascript - 等待所有嵌套的 google api 请求完成

c# - 如何从mysql数据库中提取固定数量的项目

javascript - 如何从 iframe 中获取字段数据?

jquery - 具有动态高度的简单内容 slider

javascript - 使用 jQuery 更新表后 DataTables fnFilter 不起作用

javascript - 覆盖 javascript 中的 jQuery 核心函数 - getJSON

javascript - 当运行 WebMatrix 的站点访问时,是否有任何 protected 文件类型会返回 404?

javascript - 通过 AJAX 调用生成图像时,图像大小 (.bin) 加倍

jQuery 将元素拖动到初始状态为隐藏的可排序列表中

javascript - 使用延迟和何时