为什么jQuery Ajax在IE7上这么慢?

时间:2009-04-24 20:41:03

标签: jquery ajax internet-explorer-7

我在IE7上遇到jQuery AJAX调用问题。这个简单的代码适用于FF和Opera。但在IE7上需要3-5秒。 - 这比FF快20倍!加载内容是纯HTML和内联JavaScript代码。没有JS渲染。我甚至改变了内联JavaScript代码。布依然缓慢。

$('#block').load('some url');

如何克服这个问题?任何帮助将不胜感激。

4 个答案:

答案 0 :(得分:16)

  

如何克服这个问题?任何帮助都将受到高度赞赏。

在页面加载时检测IE7,并提供一个离散的建议,即不喜欢缓慢加载的用户应升级。

答案 1 :(得分:8)

慢速jscript ie7引擎我遇到了同样的问题。我为人类添加了一个状态弹出窗口。当JS以块的形式进行时,我更新状态窗口。伪代码:

  1. 使用您的favorit js库创建状态容器。我更喜欢YUI。见他们的容器api。
  2. 加载部分数据。 - 您首先需要将其拆分为块
  3. 更新状态弹出窗口。 (增加完成的%负载,增加条形指示器等)请注意,由于您的JS线程仍在运行,屏幕可能不会在此时更改。
  4. 接下来,致电
  5. var t = setTimeout("next_step(2)", 0);
    // Where arg of 2 would mean do the second step
    // This will yield to the browser, and the display will then be updated.
    // If you want to maintain the value of "this" in the function, then do
    // something like
    var t = setTimeout("next_step.call(MyContext, 2)", 0);
    // using call to set the function's context.

    底线是用户将在屏幕上看到一些变化。注意,相对而言,超时为0的屈服步骤需要相当长的时间。所以我的代码测试浏览器,如果它不是IE,那么每个块的工作量会更多。

    向用户提供不断变化的反馈非常重要。否则他们认为这比实际需要的时间更长。

    HTH,

    拉里

答案 2 :(得分:3)

你真的没什么可做的。 IE的javascript引擎比任何其他引擎慢得多(事实上,它很糟糕)。你可以尝试IE8。 更好......略微......

答案 3 :(得分:3)

我必须看到实际的代码,但遇到类似的问题,我不得不摆脱 jQuery.load()。相反,我使用 jQuery.get()和“html”数据类型并编写了我自己的回调,我通过 .innerHTML 注入了数据。这样做,我还遇到了另一个错误(它是一个< select>标记,IE不允许.innerHTML),所以我写了一个丑陋的解决方法。

结果代码是这样的:

// Fetch data (GET method allows me to use browser cache)
$.get(url, get, function(htmlValues, txtStatus){
   that.populateSelects(htmlValues, that.selectContainers);
}, "html");


// Create <select>
var select = $('<span><select disabled="disabled"></select></span>');
$("<option>").attr("value", "").text("Loading...").appendTo(select.find("select"));


// Populate <select>
that.populateSelects = function(values, selectContainers){
   var span, select, tags;

   for(var i=0, len=selectContainers.length; i<len; i++){
      span = selectContainers[i];

      if($.browser.msie){
         tags = span.innerHTML.match(/^(<select[^>]+>).*(<\/select>)$/i);
         span.innerHTML = tags[1] + values + tags[2];
         select = span.firstChild;
      }else{
         select = span.firstChild;
         select.innerHTML = values;
      }
      $(select).removeAttr("disabled");
   }
}