JQuery Ajax 在 IE10 中不起作用

Question

Background

我想提交表格，保持在同一页面上并得到回复。

下面提到的代码在Chrome，Safari和Firefox中完美运行。但是它在IE10中不起作用。

如何使其在IE10中工作？

我的分析正确性="可疑"

在IE10中，执行$('#amazonUpload').ajaxSubmit(options)，但是服务器未收到Ajax请求，因此客户端永远不会收到响应。

.HTML

<form action="https://s3.amazonaws.com/adminportal" enctype="multipart/form-data" id="amazonUpload" method="post">   
    <input name="key" type="hidden" value="001e0000009vkRLAAY/Forms/${filename}" />             
    <input name="AWSAccessKeyId" type="hidden" value="client aws key" /> 
    <input name="policy" type="hidden" value="really long string" /> 
    <input name="signature" type="hidden" value="sign value=" />             
    <input name="acl" type="hidden" value="private" /> 
    <input name="Content-Type" type="hidden" value="application/octet-stream"/>
    <div id="uploadPage:block:j_id31"><div class="pbSubsection">      
    <input id="uploadfileOne" name="file" required="True" size="25" type="file" />
    <input class="btn" id="myBtnId55" name="myBtnId55" onclick="uploadActComplete();" style="display:none;" type="button" value="Upload" />     
</form>

JavaScript

function uploadActComplete(){
    loading();     
    var options = { 
    //      error: errorResponse,
    //       success: successResponse,
    complete: function(xhr, status) {
        alert('status is :- '+status );
        if(status =='success')
            successResponse(xhr, status);
        else if(status =='error')
            errorResponse(xhr, status);
    }
    }; 
    $('#amazonUpload').ajaxSubmit(options); 
    return false;
}
function errorResponse(xhr, status)  {     
    stoploading();    
    alert('File could not be uploaded, please try again.'); 
} 
function successResponse(xhr, status)  {     
    stoploading();    
    $("input[id$='invisiblesubmit']").click();
}

Answer 1

我尝试在我的系统上复制您的代码。 它就像一个魅力。

我使用以下jquery文件来实现上述功能。

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.js"></script> 
<script src="http://malsup.github.com/jquery.form.js"></script>

请检查您是否使用了正确的 jquery 文件。

我也尝试发布到本地文件，并且在那里正确接收了 ajax 请求。

Answer 2

你试过这个吗？

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE9" >

更多信息在这里： http://code.gishan.net/code/solution-to-ie10-ajax-problem/

@Daniel施瓦茨也回答了。 :)

Answer 3

尝试在页面的头部标签中添加元标记，这对我有用：-

<meta http-equiv="x-ua-compatible" content="IE=9" >

IE10 的工作方式类似于 IE9

Answer 4

使用提琴手分析你的ajax调用 - 它会告诉你调用是否确定。

Answer 5

我只在IE 10上遇到了类似的情况。在参数没有变化的后续请求中，不会发送到服务器并被视为缓存的请求。

在我的情况下，解决方案是从您的服务器发回一个Cache-Control: no-cache标头。它提供了更清晰的关注点分离。

在 ASP.Net 我需要添加

HttpContext.Current.Response.AddHeader("Cache-Control", string.Empty);

或

HttpContext.Current.Response.AddHeader("Cache-Control", "no-cache");

或

Response.AppendHeader("Cache-Control", "no-cache; private; no-store; must-revalidate; max-stale=0; post-check=0; pre-check=0; max-age=0"); // HTTP 1.1
Response.AppendHeader("Pragma", "no-cache"); // HTTP 1.1    

它解决了问题。

Answer 6

@amrinder007回答的后续，你可以试试这个轻微的变化

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE9">

否则，还有其他选项可能有效：

"IE=edge"
"IE=10"
"IE=EmulateIE10"
"IE=9"
"IE=EmulateIE9
"IE=8"
"IE=EmulateIE8"
"IE=7"
"IE=EmulateIE7"
"IE=5"

Answer 7

您可以将时间戳附加到作为 GET 参数请求的 URL 的末尾。这就是我绕过IE缓存的方式。

var date = new Date();
var options = { 
    url: $('#amazonUpload').attr('action')+'?time='+date.getTime(),
    // Your other options
}
$('#amazonUpload').ajaxSubmit(options); 
return false;

Answer 8

我在IE 10+中发现的最大问题是您使用的JQuery版本。由于您尚未说明您使用的是哪个版本，因此您应该验证您使用的是 JQuery 2.X 版本。

Jquery 1.X 分支适用于 IE 浏览器版本 8 或更低版本。JQuery 2.X分支适用于IE9+浏览器，Chrome和FF。我还没有用 Safari 尝试过。

还要验证您使用的 Jquery Forms 版本是否与 JQuery 2.x 兼容

。

有关更多信息，请阅读 JQuery 下载页面上的信息 jquery.com/download