如何在 IE 中上传文件？答案

【问题标题】：How can I upload files in IE?如何在 IE 中上传文件？
【发布时间】：2012-12-03 08:46:01
【问题描述】：

我想使用以下 html 和 js 将文件上传到我的服务器：

<script type="text/javascript">
    $(function() {
        $('#uploadimageBtn').click(function() {
                $('#imageInput').click();
        });

        $('#imageInput').change(function(event) {
                $('#loading-spinner').show();
                var file = $(this).val();
                var fileName = file.split("\\");
                $('#uploadimageBtn-inner').html("Uploading..."); 
                $('#uploadForm').submit();
                event.preventDefault();
        });                
    });
</script>

<div id="uploadimageBtn">
    <g:img id="loading-spinner" style="display:none;" file="loading.gif"/>
    <div id="uploadimageBtn-inner">Click to upload a file</div>
</div>  

<g:form name="uploadForm" action="update" method="post" enctype="multipart/form-data">
    <div style="height: 0px;width: 0px; overflow:hidden;">
        <input id="imageInput" name="image" type="file" value="upload"/>
    </div>
</g:form>

它在所有主流浏览器中都能完美运行，但在 IE 中却无法运行。

那么我必须改变什么才能让它发挥作用？

【问题讨论】：

你应该看看这个答案。我发现它是我所见过的不使用插件或任何东西的最好的：stackoverflow.com/a/13679816/1264846。在有人告诉你问题是什么之后，你真的应该做更多的研究并尝试自己解决问题。 @Magus 给了你很多东西。
@James Kleeh 这很好，但它对 IE 没有帮助。那么你能帮我解决下面的问题吗？我花了很多时间，却不知道该怎么办。

标签： javascript internet-explorer grails file-upload grails-2.0

【解决方案1】：

Internet Explorer 对文件输入具有一定的安全性。您不能触发对文件输入的点击。而且我认为您不能在文件输入上收听某些事件。

如果您想做这样的事情，您必须使用带有不可见文件输入的“技巧”。您在 img 上放置一个不可见的文件输入，当用户单击 img 时，他实际上是在输入文件中单击。但是在 IE 上不能克隆文件输入，所以必须把这个输入从 DOM 中分离出来，放到一个表单中，然后提交。

您可以查看：http://fineuploader.com/ 我认为它可以做你想做的事情。

【讨论】：