Ajax 调用在 IE8 中不起作用答案

【问题标题】：Ajax call not working in IE8Ajax 调用在 IE8 中不起作用
【发布时间】：2014-06-13 13:41:41
【问题描述】：

我正在阅读有关此的几篇文章，并对我的代码进行了一些更改，但没有运气。

任何人都可以调查一下，看看这里发生了什么？或者也许是另一种方式来做我需要的事情（使用 ziptastic 通过邮政编码检索城市、州）

代码在 Chrome 中运行良好 (http://jsfiddle.net/7VtHc/117/)

html

<asp:TextBox ID="txtZipCode" runat="server"></asp:TextBox>        
<asp:TextBox ID="txtCity" runat="server"></asp:TextBox> 
<asp:TextBox ID="txtState" runat="server"></asp:TextBox>

脚本

<script src="http://code.jquery.com/jquery-1.10.2.js" type="text/javascript"></script>

<script type="text/javascript">
    $(function () {
        $("input[id$='txtZipCode']").keyup(function () {
            var el = $(this);

            if (el.val().length === 5) {
                $.ajax({
                    url: "http://zip.getziptastic.com/v2/US/" + el.val(),
                    cache: false,
                    dataType: "json",
                    type: "GET",
                    success: function (result, success) {
                        $("input[id$='txtCity']").val(result.city);
                        $("input[id$='txtState']").val(result.state);
                    }
                });
            }
        });
    });
</script>

谢谢，

【问题讨论】：

您可以查看此页面并使用XMLHttpRequest()：javascriptkit.com/jsref/ajax.shtml
您不能告诉您在 IE8 中遇到了什么错误，而是...？
你应该在IE中使用Xdomain请求来实现跨域ajax
@A.Wolff 在 IE8 中什么也没有发生，什么都没有 :(

标签： javascript jquery asp.net ajax internet-explorer-8

【解决方案1】：

您的代码中的实际问题是在 ajax 错误回调中显示“无传输”错误。添加这一行 jQuery.support.cors = true;会解决你的问题

在 IE 和其他浏览器中尝试以下代码。

    <html>
    <head>
    <script type='text/javascript' src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
          <script>
    $(document).ready(function() {
        jQuery.support.cors = true;
        $("#zip").keyup(function() {
            var el = $(this);

            if (el.val().length === 5) {
               $.ajax({
                    url: "http://zip.getziptastic.com/v2/US/" + el.val(),
                    cache: false,
                    dataType: "json",
                    type: "GET",
                    success: function(result, success) {
                        $("#city").val(result.city);
                        $("#state").val(result.state);
                    }
                });
            }
        });
    });

    </script>
    </head>
    <body>
        <p>Zip Code: <input type="text" id="zip" /></p>
        <p>City: <input type="text" id="city" /></p>
        <p>State: <input type="text" id="state" /></p>
    </body>
    </html>

查看这些链接：

【讨论】：

【解决方案2】：

问题是 IE8 不支持 Cross Origin Resource Sharing (CORS) XHR，所以你不能使用原生 XHR 或 jQuery 的 $.ajax 进行跨域 ajax 调用。

对于 IE8，Microsoft 决定提出他们自己的跨域 XHR，而不是使用名为 XDomainRequest 的 CORS XHR，因此您必须实现它以支持 IE8 用户。示例用法见this answer。

或者，您可以通过本地服务器端代理跨域请求，使外部请求成为服务器到服务器的情况，不受Same Origin Policy的约束。

【讨论】：

【解决方案3】：

您的请求看起来不错，但如果是 IE8，那么您正在加载的文件头可能有问题，它必须是 application/json

PHP 示例

header('Content-Type: application/json');

【讨论】：

【解决方案4】：

很简单，在你的页面添加下面一行：

<meta http-equiv="X-UA-Compatible" content="IE=edge;chrome=1" />

【讨论】：