JQuery Ajax无法在IE10中运行

时间:2013-09-12 12:53:32

标签: jquery internet-explorer-10 jquery-file-upload jquery-forms-plugin

背景

我想提交一份表格,留在同一页面上&得到回应。

下面提到的代码在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();
}

8 个答案:

答案 0 :(得分:5)

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

我使用了以下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请求。

答案 1 :(得分:3)

你试过这个吗?

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

此处有更多信息:http://code.gishan.net/code/solution-to-ie10-ajax-problem/

@Daniel Schwarz也回答道。 :)

答案 2 :(得分:1)

尝试在页面的head标记内添加元标记,这对我有用: -

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

IE10的工作方式与IE9类似

答案 3 :(得分:1)

使用fiddler分析您的ajax电话 - 它会告诉您电话是否已经确定。

答案 4 :(得分:0)

我只面临与IE 10类似的情况。在后续请求中,参数没有变化,不会发送到服务器&amp;被认为是缓存的。

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

在ASP.Net中我需要添加

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

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

OR

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    

它解决了这个问题。

答案 5 :(得分:0)

跟随@ 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"

答案 6 :(得分:0)

您可以将时间戳附加到作为GET参数请求的URL的末尾。这就是我如何利用IE的缓存。

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

答案 7 :(得分:0)

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

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

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

有关详细信息,请阅读jquery.com/download

上有关JQuery下载页面的信息