Internet Explorer未按顺序执行Javascript_Javascript_Html_Ajax_Internet Explorer

Internet Explorer未按顺序执行Javascript

javascript html ajax internet-explorer

Internet Explorer未按顺序执行Javascript,javascript,html,ajax,internet-explorer,Javascript,Html,Ajax,Internet Explorer,我正在开发一个web应用程序，它需要在屏幕上显示信息的同时进行一些后端处理。显然，这最适合我正在使用的AJAX。然而，在开始AJAX请求之前，我将通过Javascript进行一些可视化更改。具体而言： document.getElementById（'calc'）.innerHTML='Calculating…'； document.getElementById（'calc'）.disabled=true 然后，我继续通过AJAX调用servlet 这在Firefox中运行良好。但是，在Inte

我正在开发一个web应用程序，它需要在屏幕上显示信息的同时进行一些后端处理。显然，这最适合我正在使用的AJAX。然而，在开始AJAX请求之前，我将通过Javascript进行一些可视化更改。具体而言：

document.getElementById（'calc'）.innerHTML='Calculating…'；
document.getElementById（'calc'）.disabled=true
然后，我继续通过AJAX调用servlet
这在Firefox中运行良好。但是，在Internet Explorer（版本8）中，视觉更改从未生效。在AJAX处理完成之前，应用程序只会在那里停留一两分钟。看起来AJAX代码是在页面更改之前执行的，但我不知道为什么会这样
如蒙协助，将不胜感激
编辑：下面是我在一个简短的、独立的、正确的例子中所做的最大努力
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Cache-Control" content="no-cache">
<script>
var inEdit = 0;
var calcCurrent = false; 
function recalc() {
var xmlhttp=new XMLHttpRequest();
if (xmlhttp==null)
{
  var tmp = "Your browser does not support XML! ";
  tmp += "Please contact your Technical Support division for information on how to upgrade.";
  alert(tmp);
}
else
{
  document.getElementById('calc').innerHTML = 'Calculating...';
  document.getElementById('calc').disabled = true;
  var url = "http://www.nzherald.co.nz/";
  xmlhttp.open("GET",url,false);
  xmlhttp.send(null);
  if (xmlhttp.responseText.indexOf("Success")>=0) {
    alert(xmlhttp.responseText);
  }
  else
    alert(xmlhttp.responseText);
  document.getElementById('calc').value = 'Recalculate';
  document.getElementById('calc').disabled = false;
}
}
</script>
</head>
<body>
<a id='calc' class='Button' href="javascript:recalc()" >Recalculate</a>
</body>
</html>


var inEdit=0；
var calcCurrent=false；
函数recalc（）{
var xmlhttp=new XMLHttpRequest（）；
if（xmlhttp==null）
{
var tmp=“您的浏览器不支持XML！”；
tmp+=“有关如何升级的信息，请联系您的技术支持部门。”；
警报（tmp）；
}
其他的
{
document.getElementById（'calc'）。innerHTML='Calculating…'；
document.getElementById（'calc'）.disabled=true；
变量url=”http://www.nzherald.co.nz/";
open（“GET”，url，false）；
xmlhttp.send（空）；
if（xmlhttp.responseText.indexOf（“成功”）>=0）{
警报（xmlhttp.responseText）；
}
其他的
警报（xmlhttp.responseText）；
document.getElementById（'calc'）。值='Recompute'；
document.getElementById（'calc'）。disabled=false；
}
}

唯一的问题是这个URL几乎立即返回。在我的应用程序中，它指向一个进行数据库处理大约一分钟的页面，因此问题更加明显。
我假设这是一个
元素：
document.getElementById('calc').value = 'Calculating...';
document.getElementById('calc').setAttribute('disabled','disabled');

为了获得最佳的多浏览器兼容性，请尝试使用jQuery：
$("#calc").val('Calculating...').attr('disabled','disabled');  

这两行代码非常简单。我想到了两件事：
是否为另一个元素定义了ID。您能否再次检查calc是否未在页面中的任何其他位置使用？最好在视图源代码中执行Ctrl+F
验证您的HTML。确保属性中没有缺少任何结束标记或引号
您正在将异步参数的“false”传递给xmlhttp.open（）调用。因为自从您设置calc元素的innerHTML属性后，堆栈还没有展开，IE没有机会重新绘制屏幕
你有几个选择
重新构造代码，使ajax调用异步，并通过回调通知获得结果
或者。。。。在calc上设置innerHTML属性，然后调用延迟为0的setTimeout和一个回调函数，该回调函数被编写为调用xmlhttp.open，就像现在一样。这将允许堆栈展开，IE将重新绘制DOM更改，然后执行ajax调用。下面是您的代码的黑客版本，以演示我所说的内容
下面是一些黑客代码演示#2
您的calc
元素是什么？它可能不支持IE8be中的innerHTML
，请确保javascript中没有任何console.log语句，否则IE可能不会在它们之后运行代码。如果您在运行开发人员工具时打开它，那么它会。如果这是一个问题，请提供一个。calc是一个锚元素，我很确定它支持innerHTML。此外，innerHTML最终也会改变，只是需要很长时间。我想不出有哪个浏览器会对第一个示例产生问题。jQuery没有做任何有帮助的事情here@ron-要获得“最佳浏览器兼容性”，只需直接设置属性，就不需要setAttribtue或jQuery（或其凌乱的attr函数）。感谢您的建议。我检查了这两个问题。验证发现了许多不符合标准的HTML，包括缺少的标记。不幸的是，我描述的问题仍然存在，但是识别验证问题还是很好的！再次感谢。如果上面的代码snippit不起作用，请尝试将超时从“0”更改为“1”或更高。太棒了！这个选项（使用超时）完全解决了我的问题。很高兴知道为什么会发生这种情况。非常感谢。@enjiner-很高兴它起作用了。理想情况下，您选择选项1。否则，在ajax调用完成之前，ajax请求中的长时间延迟可能会使您的web页面“冻结”（或至少阻止其他javascript代码运行）。
var xmlhttp;

function recalc() {
    xmlhttp=new XMLHttpRequest();
    if (xmlhttp==null)
    {
      var tmp = "Your browser does not support XML! ";
      tmp += "Please contact your Technical Support division for information on how to upgrade.";
      alert(tmp);
    }
    else
    {
      document.getElementById('calc').innerHTML = 'Calculating...';
      document.getElementById('calc').disabled = true;
      setTimeout(recalc_start, 0);
    }
}

function recalc_start() {
  var url = "http://www.nzherald.co.nz/";

  xmlhttp.open("GET",url,false);
  xmlhttp.send(null);
  if (xmlhttp.responseText.indexOf("Success")>=0) {
    alert(xmlhttp.responseText);
  }
  else {
    alert(xmlhttp.responseText);
  }
  document.getElementById('calc').value = 'Recalculate';
  document.getElementById('calc').disabled = false;
}