Internet Explorer 中的 Jquery：查找图像问题（适用于 FF 和 Chrome）答案

【问题标题】：Jquery in Internet Explorer: find image problem(works in FF and Chrome)Internet Explorer 中的 Jquery：查找图像问题（适用于 FF 和 Chrome）
【发布时间】：2010-12-01 10:06:31
【问题描述】：

$.get("js/getflickreasy.php", function(data)
{
  $(data).find("item").each(function()
  {
    var title = $(this).find("title").text();
    var description = $(this).find("description").text();
    var thumbnail = $(description).find("img").attr("src");
  }
  );
}
);

在 Firefox 和 Chrome 中，这可以正常工作。但在 Internet Explorer 中，变量 title 和 description 将获得值“”。缩略图未定义。我知道它在 IE 中获取数据。 getflickreasy.php 从 flickr 检索 rss。

我认为这不是IE缓存的问题，因为清除它后还是一样。可能是 IE 中的$(this).find 有问题。

您可以在my webpage查看实际代码

编辑：使用 $.get 它将检索数据，但 Internet Explorer 无法处理它。使用 $.ajax 它现在根本不会检索数据。

编辑：我将 php 获取图像的 url 更改为：
http://api.flickr.com/services/feeds/photos_public.gne?id=42980910@N02&lang=en-us&format=xml

而不是：

http://api.flickr.com/services/feeds/photos_public.gne?id=42980910@N02&lang=en-us&format=rss_200

我在 php 文件中添加了header("content-type: text/xml");。我认为它现在应该得到 xml，对吧？提琴手说：

HTTP/1.1 200 正常日期：格林威治标准时间 2010 年 11 月 17 日星期三 20:45:43 服务器：阿帕奇 X-Powered-By: PHP/5.2.13 连接：关闭内容类型：文本/xml 内容长度：25878

但还是同样的问题（至少我是这么认为的）。

【问题讨论】：

标签： jquery internet-explorer

【解决方案1】：

嗯...您可能需要将数据类型设置为 XML。而不是使用$.get() 尝试$.ajax()：

$.ajax({
    type: "GET",
    url: "js/getflickreasy.php",
    dataType: "xml",
    success: function(data) {
        $(data).find("item").each(function() {
            var item = $(this), title, description, thumbnail;

            title = item.find("title").text();
            description = item.find("description").text();
            thumbnail = item.find("img").attr("src");
        });
    }
});

问题很可能是服务器的响应。

使用您当前的配置（使用$.ajax 方法的配置），IE 会收到响应。我使用名为fiddler 的工具验证了这一点。

问题是，浏览器正在发送以下标头：

Accept: application/xml, text/xml

但是服务器的响应是：

Content-Type: text/html

在您可以让服务器返回有效的 XML 标头之前，IE（以及 $.ajax 方法）将继续失败。

这是我认为 IE 做对的少数几次之一！其他浏览器没有失败的事实令人恼火。他们应该。这样你就不会认为这是一个 IE 特定的问题而感到困惑。但是，我离题了。

【讨论】：

此代码无效。不会进入成功：function(data) {}
“它不会进入”是什么意思？你能解释更多吗？
它不会进入那个函数，所以我是说数据没有成功加载，这就是它没有成功的原因：
啊哈！因此，您拥有的脚本似乎没有返回有效的 xml。
尝试将其添加到脚本顶部header ("content-type: text/xml");

【解决方案2】：

我使用 IE8 访问了您的页面，并且您拥有的数据变量肯定会返回您想要的 XML。所以信息已经准备好进行解析，只是不是以 IE 友好的方式。

除了上面提到的@Stephen 之外，我倾向于使用更强大的东西。确保它适用于各种版本的 IE 以及所有非 EI 浏览器。下面的方法还允许我将成功和错误事件传递给其他函数进行处理。

// this method of doing the ajax call is a little beefier than required. 
//  - allows us to test local XML files as well with IE
//  - allows us to pass additional arguments with the success / error functions.
$.ajax({
    type: "GET",
    url: your.url.here,
    cache: true,    // or set to false
    dataType: ($.browser.msie) ? "text/xml" : "xml",
    success: function(data) {
            var xml;
            if (typeof data == "string") {
                xml = new ActiveXObject("Microsoft.XMLDOM");
                xml.async = false;
                xml.loadXML(data);
            } else {
                xml = data;
            }
            functionToHandleData(xml);
    },
    error: function(xhr, textStatus, errorThrown) {
            //console.log('Problem Occured: \n' + xhr.statusText + " | " + textStatus + " | " + errorThrown);
            functionToHandleError();
    }
});

【讨论】：

我激活了 console.log 并检索到：未捕获的 ReferenceError: changeTitle is not defined 发生的问题：OK |解析器错误 |未定义
"Problem Occured: OK | parsererror | undefined" 是我对错误事件的输出（如 console.log 行所示），但 changeTitle 是通过代码中某处抛出的错误。跨度>

【解决方案3】：

对于通过 AJAX 接收的 HTML/XML 的代码正确性，IE 比 Firefox 和 Chrome 更挑剔。

如果 FF 和 Chrome 正在处理 IE 不处理的 AJAX 请求，这通常是由于返回的 HTML/XML 中的解析错误。

【讨论】：