问题与jQuery / iframe的文件上传解决方案 [英] Issue with jQuery / iframe File Uploading Solution

问题描述

我最近实施一个jQuery / iframe解决方案，以文件上传和已运行到一个相当恼人的问题（仅当然IE）。

在点击我的上传按钮，然后选择要上传的文件，我自动提交包含该文件到我的iframe的形式。然而 - 我需要的任何地方点击页面上，以便提交处理并在我的控制器射击动作

我相信这是与IFRAME获得焦点，这似乎是从完成执行停止变功能的问题，但我不能完全肯定。也许有些类型的onload功能是必需的iframe来踢焦点回到原来的页面，以继续执行？

code：

表格及放大器;文件上传：

 ＆LT;表ID =attachForm行动=＆LT;％= Url.Action（TestUpload，图像）％GT;
      方法=POSTENCTYPE =的multipart / form-data的TARGET ='upload_target'＆GT;
        ＆LT;输入ID ='actualupload'类型='文件'多重=NAME =文件/＆GT;
＆LT; /表及GT;
＆LT; IFRAME ID ='upload_target的名字='upload_target'SRC =''
        风格=WIDTH：0;高度：0;边框：0; FRAMEBORDER =0＆GT;＆下; / iframe的＆GT;
 

jQuery来提交表单：

  $（＃actualupload）。生活（'变'，函数（）
{
    $（＃attachForm）提交（）。
    警报（炒鱿鱼！）; //这只点击屏幕后，后出现
                     //文件选择。
}）;
 

解决方案

似乎 .live（）导致这种奇怪的行为。如果你使用即。

  $（函数（）{
    $（＃actualupload）。改变（函数（）
    {
        $（＃attachForm）提交（）。
        警报（炒鱿鱼！）; //这只点击屏幕后，后出现
                         //文件选择。
    }）;
}）;
 

它工作在IE浏览器了。

I recently implemented a jQuery / iframe solution to file uploading and have run into a rather annoying issue (only in IE of course).

Upon clicking my upload button and selecting a file to upload, I automatically submit the form that contains the file to my iframe. However - I am required to click anywhere on the page in order for the submit to process and fire the action in my Controller.

I believe it is an issue with the iframe gaining focus, which seems to be stopping the 'change' function from finishing execution, but I am not entirely sure. Perhaps some type of onload function is required for the iframe to kick the focus back to the original page to continue execution?

Code:

Form & File Upload:

<form id="attachForm" action="<%= Url.Action("TestUpload","Images") %>" 
      method="post"  enctype="multipart/form-data" target='upload_target' >
        <input id='actualupload' type='file' multiple="" name='file' />
</form>
<iframe id='upload_target' name='upload_target' src='' 
        style="width:0; height: 0; border: 0;" frameborder="0"></iframe>

jQuery to Submit Form:

$("#actualupload").live('change',function()
{
    $("#attachForm").submit();
    alert("Fired!"); //This only occurs after clicking on the screen after the 
                     //file selection.
});

解决方案

It seems that .live() causes this strange behavior. If you use i.e.

$(function() {
    $("#actualupload").change( function()
    {
        $("#attachForm").submit();
        alert("Fired!"); //This only occurs after clicking on the screen after the 
                         //file selection.
    });
});

it works in IE too.

这篇关于问题与jQuery / iframe的文件上传解决方案的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！