jQuery .find() 在 IE 中不返回数据，但在 Firefox 和 Chrome 中返回 [英] jQuery .find() doesn't return data in IE but does in Firefox and Chrome

问题描述

我帮一位朋友帮了他一些网络工作.他需要一种简单的方法来更改他网站上的几段文字.我没有让他编辑 HTML，而是决定提供一个包含消息的 XML 文件，然后我使用 jQuery 将它们从文件中拉出并插入到页面中.

I helped a friend out by doing a little web work for him. Part of what he needed was an easy way to change a couple pieces of text on his site. Rather than having him edit the HTML I decided to provide an XML file with the messages in it and I used jQuery to pull them out of the file and insert them into the page.

效果很好...在 Firefox 和 Chrome 中，在 IE7 中不太好.我希望你们中的一位能告诉我原因.我做了一个公平但谷歌搜索但找不到我要找的东西.

It works great... In Firefox and Chrome, not so great in IE7. I was hoping one of you could tell me why. I did a fair but of googling but couldn't find what I'm looking for.

这是 XML:

<?xml version="1.0" encoding="utf-8" ?>
<messages>
  <message type="HeaderMessage">
    This message is put up in the header area.
  </message>
  <message type="FooterMessage">
    This message is put in the lower left cell.
  </message>
</messages>

这是我的 jQuery 调用:

And here's my jQuery call:

<script type="text/javascript">
  $(document).ready(function() {
    $.get('messages.xml', function(d) {
      //I have confirmed that it gets to here in IE
      //and it has the xml loaded.
      //alert(d); gives me a message box with the xml text in it
      //alert($(d).find('message')); gives me "[object Object]"
      //alert($(d).find('message')[0]); gives me "undefined"
      //alert($(d).find('message').Length); gives me "undefined"
      $(d).find('message').each(function() {
        //But it never gets to here in IE
        var $msg = $(this);
        var type = $msg.attr("type");
        var message = $msg.text();
        switch (type) {
        case "HeaderMessage":
          $("#HeaderMessageDiv").html(message);
          break;
        case "FooterMessage":
          $("#footermessagecell").html(message);
          break;
          default:
        }
      });
    });
  });
</script>

我需要在 IE 中做一些不同的事情吗?基于带有 [object Object] 的消息框，我假设 .find 在 IE 中工作，但由于我无法使用 [0] 索引到数组或检查它的 Length 我猜这意味着 .find 不是返回任何结果.有什么理由可以在 Firefox 和 Chrome 中完美运行但在 IE 中失败?

Is there something I need to do differently in IE? Based on the message box with [object Object] I'm assumed that .find was working in IE but since I can't index into the array with [0] or check it's Length I'm guessing that means .find isn't returning any results. Any reason why that would work perfectly in Firefox and Chrome but fail in IE?

我是 jQuery 的新手，所以我希望我没有做过一些愚蠢的事情.上面的代码是从论坛中删除的，并根据我的需要进行了修改.由于 jQuery 是跨平台的，我想我不必处理这个烂摊子.

I'm a total newbie with jQuery so I hope I haven't just done something stupid. That code above was scraped out of a forum and modified to suit my needs. Since jQuery is cross-platform I figured I wouldn't have to deal with this mess.

我发现如果我在 Visual Studio 2008 中加载页面并运行它，那么它将在 IE 中工作.所以结果证明它在通过开发 Web 服务器运行时总是有效的.现在我在想 IE 只是不喜欢在从本地驱动器加载的 XML 中执行 .find 操作，所以也许当它在实际的 Web 服务器上时它会正常工作.

I've found that if I load the page in Visual Studio 2008 and run it then it will work in IE. So it turns out it always works when run through the development web server. Now I'm thinking IE just doesn't like doing .find in XML loaded off of my local drive so maybe when this is on an actual web server it will work OK.

我已经确认从 Web 服务器浏览时它可以正常工作.一定是 IE 的一个特性.我猜这是因为网络服务器为 xml 数据文件传输设置了 mime 类型，没有那个 IE 就不能正确解析 xml.

I have confirmed that it works fine when browsed from a web server. Must be a peculiarity with IE. I'm guessing it's because the web server sets the mime type for the xml data file transfer and without that IE doesn't parse the xml correctly.

推荐答案

检查响应的内容类型.如果您将 messages.xml 设为错误的 MIME 类型，Internet Explorer 将不会将其解析为 XML.

Check the content type of the response. If you get messages.xml as the wrong mime type, Internet Explorer won't parse it as XML.

要检查内容类型，您需要访问 XMLHttpRequest 对象.正常的成功回调不会将其作为参数传递，因此您需要添加一个通用的 ajaxComplete 或 ajaxSuccess 事件处理程序.这些事件的第二个参数是 XMLHttpRequest 对象.您可以对其调用 getResponseHeader 方法来获取内容类型.

To check the content type, you need access to the XMLHttpRequest object. The normal success callback doesn't pass it as a parameter, so you need to add a generic ajaxComplete or ajaxSuccess event handler. The second parameter for those events is the XMLHttpRequest object. You can call the getResponseHeader method on it to get the content type.

$(document).ajaxComplete(function(e, x) {
    alert(x.getResponseHeader("Content-Type"));
});

不幸的是，我所知道的 Internet Explorer 中无法覆盖服务器发送的内容，因此如果错误，您需要更改服务器以发送内容类型的text/xml".

Unfortunately there's no way that I know of in Internet Explorer to override what the server sends, so if it's wrong you need to change the server to send "text/xml" for the content type.

某些浏览器有一个 overrideMimeType 方法，您可以在 send 之前调用该方法以强制它使用text/xml"，但 Internet Explorer 不支持该方法据我所知.

Some browsers have a overrideMimeType method that you can call before send to force it to use "text/xml", but Internet Explorer doesn't support that as far as I know.

这篇关于jQuery .find() 在 IE 中不返回数据，但在 Firefox 和 Chrome 中返回的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！