Question

我有一个 Javascript 函数, 需要很长的时间才能运行。我想显示一个加载图标, 直到 javascript 函数返回, 但函数加载时页面上没有显示任何内容; 页面是白色的, 没有做任何事情。

如果我使用铬调试, 在调用函数之前我看到我的装货图标, 然后当调用它时它就消失了。我以为我可以用 AJAX 调用一个 PHP 页面, 该页面包含 Javascript, 但 AJAX 的反应实际上包含了那个 Javascript...

$.ajax({
  type: "POST",
  url: "resources/scripts/loadXML.php",
  data: "datafile="data_file_path,
  success: function(msg){
    alert( "Data Saved: " + msg );
  }
});

并且我得到了这个。MSG等于这个(这实际上是页面中的剧本)。

<script type="text/javascript">

if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.open("GET",<?php echo json_encode($data_file); ?>,false);
xmlhttp.send();
return xmlhttp;
</script>

我只是不想我的页面是白色的它会装满那个功能吗...

<强度 > EDIT:

我想运行这个代码自动提醒, 这样它就可以打开我的页面。我想在运行此函数时看到一个旋转器。之前, 它就在同一页上, 这样我就可以很容易地设置文件打开, 但是现在, 如果我发出一个自动提醒, 我要把它放到另一个文件中。但是, 我如何将参数传送到这个文件中?!! : : @ label

<script type="text/javascript">

if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.open("GET",**$NEEDTOGETTHEFILENAME**,false);
xmlhttp.send();
return xmlhttp;
</script>

Answer 1

既然您正在使用jquery 进行请求, 最简单的方法是将请求包装在

$(document).ready(function(){
  //show spinner
  //your ajax request here
}

,然后在请求返回时以内容隐藏或替换旋转器。

这就提出了这样一个问题:你为什么要做一个ajax请求来得到一个脚本来做另一个ajax请求?你到底想在这里完成什么?

Answer 2

在Submit 程序之前添加一个 < code> 处理器, 该处理器将装入一个旋转器或其它东西, 让用户知道该页面正在装入。

$.ajax({
  type: "POST",
  url: "resources/scripts/loadXML.php",
  data: "datafile="data_file_path,
  beforeSubmit: function(){
        //show a spinner here
  },
  success: function(msg){
    //remove spinner
    alert( "Data Saved: " + msg );
  }
});

友情链接