jQuery Ajax 在 IE 6/7/8 中不工作，在 FF/Safari/Chrome 中工作

Posted 2023-05-09

【中文标题】jQuery Ajax 在 IE 6/7/8 中不工作，在 FF/Safari/Chrome 中工作

【英文标题】：jQuery Ajax not working in IE 6/7/8, works in FF/Safari/Chrome

【发布时间】：2010-12-01 13:15:43

【问题描述】：

有问题的页面是http://matthewanderson.cc

我是一个 javascript 新手，在基于 WordPress 的投资组合网站上工作。我正在使用 jQuery .load() 从 WordPress 帖子中获取内容，它适用于 Firefox、Safari 和 Chrome，但不适用于任何 IE。

具体的Ajax代码在这里：

$(document).ready(function()
$("a.ajax-load").click(function (event) 
//prevent standard browser link behavior
event.preventDefault();
//Fade out any existing visible content
$("#project-expanded *:visible").fadeOut("slow");
//Insert loading graphic
$("#project-expanded").html('<p style="text-align:center;"><img src="http://matthewanderson.cc/wp-content/themes/tiles/ajax-loader.gif"   style="margin:160px 0 0"/></p>');
//Pull URL from clicked object, store it in a variable, add string " #ajax-content" to be used in next line
var postAjaxURL = $(this).attr("href") + ' #ajax-content';
//Fetch content from the URL contained in postAjaxURL (filtering for #ajax-content), insert results into #project-expanded
$("#project-expanded").load( postAjaxURL, function()
  //Set CSS contents of #project-expanded to display:none so they can be faded in later
  $("#project-expanded *").css("display","none");
  //Expand #project-expanded using jQuery .show effect
  $("#project-expanded").show("slow", function()
    //After #project-expanded is expanded, fade in the contents
    $("#project-expanded *").fadeIn("slow");   
  );
);
);

我已将以下标头添加到所有要获取的页面以防止 IE 缓存，但这似乎没有帮助

<?
//Set no caching
header("Expires: Mon, 26 Jul 1997 05:00:00 GMT");
header("Last-Modified: " . gmdate("D, d M Y H:i:s") . " GMT");
header("Cache-Control: no-store, no-cache, must-revalidate");
header("Cache-Control: post-check=0, pre-check=0", false);
header("Pragma: no-cache");
?> 

有人有什么想法吗？

更新：

提一下，IE 的所有版本都没有报告任何 javascript 错误，这可能是谨慎的做法。

另外，我认为这不是缓存问题。在查看了使用 Fiddler 发出的页面请求后，我可以看到页面外部的内容被成功调用。

【参考方案1】：

您可以做的另一件事是将 &rand=230948234 之类的内容附加到您要提取的 url。这通常会迫使浏览器重新下载它，因为它不知道该参数是没有意义的。这将生成一个合适的随机元素：

var randomnumber=Math.floor(Math.random()*100000000);
var postAjaxURL = $(this).attr("href") + ' #ajax-content';
$("#project-expanded").load( postAjaxURL, rand: randomnumber, function()

编辑：已修复！ URL 参数没有按照我原来的方式设置。

【讨论】：

嗯......添加这似乎也打破了FF。我正在复制并粘贴您的两行代码来代替我声明 var postAjaxURL 的那一行。这是实现您所说的正确方法吗？

@servicesmatt — 请注意，“&rand=”只有在链接的 URL 已经包含 GET 参数时才是正确的。如果不是，则必须改为“?rand=”。查看您的网站，我没有看到 任何 ajax-load 带有 GET 参数的链接，所以这可能是您的问题。

@Ben Blank - 我只是尝试用 "?rand=" 代替 "&rand=" ，但运气不佳。据我了解，jQuery 的 load() 方法使用 GET，所以我假设它都是在 jQuery 中处理的。

请再检查一遍，我错误的将URL参数添加到了URL字符串中，这不是jQuery中的做法。

嘿伙计，感谢您的努力。不幸的是，仍然没有运气。这可能不是缓存问题吗？