为什么我的表单不能在 Internet Explorer 9 中上传文件？答案

【问题标题】：Why does my form not upload files in Internet Explorer 9?为什么我的表单不能在 Internet Explorer 9 中上传文件？
【发布时间】：2013-03-13 23:58:39
【问题描述】：

欢迎观看“为什么 Internet Explorer 如此糟糕？”的第 32,342,343 集...

我看到很多报告说 IE9 在上传文件方面做得很糟糕。显然，它有很多关于何时会或不会起作用的警告（如果有人有明确的清单，我很乐意看到它）。但是，我看到的大多数问题/解决方案都与javascript有关，通常是jQuery表单插件或类似的东西。

我的表单不是通过 AJAX 提交的，并且文件输入字段没有被 css 隐藏或遮挡。然而，我每天从 IE9 上尝试提交表单的用户那里收到几张支持票，但“什么也没发生”（=表单提交。没有错误，但文件没有上传。）我没有收到任何投诉不同的浏览器，IE8 甚至似乎可以工作（和以往一样）。

这是我的表格的顶部。我错过了什么吗？

<form action="http://mysite.dev/account-settings/?open=resume" method="post" class="wpjb-form" enctype="multipart/form-data">    

        <input type="hidden" name="resume_form" value="resume_form" />
        <fieldset class="wpjb-fieldset-default">

            <input id="firstname" name="firstname" type="hidden" class="regular-text " value="John" />
            <input id="lastname" name="lastname" type="hidden" class="regular-text " value="Henry" />
            <input id="email" name="email" type="hidden" class="regular-text " value="john.henry@johnhenry.com" />

            <div class="wpjb-element-input-checkbox wpjb-element-name-is_active">
                <label class="wpjb-label">Show resume? </label>
                <div class="wpjb-field">
                    <label for="is_active_1"><input type="checkbox" class="" name="is_active" id="is_active_1" value="1" checked="checked" /> Yes <small style="display:inline;">(Uncheck to hide your resume)</small></label>

                </div>
            </div>
            <div class="wpjb-element-input-select-one wpjb-element-name-file">
                            <label class="wpjb-label">Upload a <i>new</i> resume file</label>
                <div class="wpjb-field">
                    <input style="line-height:1em;" id="file" name="file" type="file" class="regular-text " />
                    <small class="wpjb-hint">Accepted file types: doc, docx, odf, pdf, rtf</small>
                </div>
            </div>
        </fieldset>
        ...

这样继续，还有几个<fieldset>s，然后这样结束：

    ....
    <p class="submit">
        <input type="submit" name="Submit" id="wpjb_submit" value="Save Changes" />
    </p>
</form>

更新我为所有从未遇到过这个问题的人感到高兴，但不仅仅是我： http://answers.microsoft.com/en-us/ie/forum/ie9-windows_vista/cannot-upload-files-using-internet-explorer-9/5724d921-ae71-e011-8dfc-68b599b31bf5

更新2 我看到很多建议添加元标记以强制用户代理使用 IE8... <meta http-equiv="X-UA-Compatible" content="IE=8" /> 我不想这样做，因为虽然我支持 IE8，但我网站上的许多元素在 IE8 和 IE9 中呈现不同。这将创建一个相当草率的用户体验，因为任何 IE 用户都会在该特定页面上临时“时间扭曲”回到 IE8。

【问题讨论】：

我只能纠正一个猜测，因为这应该可以正常工作（诅咒你，IE！）。因此为什么它是评论：1）mysite.dev/account-settings/?open=resume 我们可以将其更改为不是查询网址吗？我过去在使用 IE 时遇到过查询问题。 Legacy JScript 将 query 作为关键字，可以在您不知情的情况下修改 url 的查询字符串。让我困惑了好几个星期。 2）也许我们也可以尝试验证文件是否在服务器端接收？你说没有错误，但不应该有吗？它可以重定向回此页面以重新提交（以及预先填充的其他字段）。
我将测试您对查询网址的想法。至于验证在服务器端收到的文件......它肯定不会保存在那里，因为同一个页面检查它的存在并且它肯定没有到达那里。也许你在建议更复杂的东西，比如数据是否真的被发送了？这更有趣，因为在我的表单上，需要上传文件。如果真实浏览器上的用户试图跳过它，表单提交将失败并且用户会看到一条消息。在 IE9 中，实际上什么都没有发生。表单“成功”提交，但没有文件上传/保存或错误。
当表单像

上传
标签：
要上传的本地文件：
您可以尝试在客户端和服务器端简化代码，直到找到罪魁祸首（假设有一个）。我刚刚在我的服务器上对您的表单进行了测试，并且能够在 IE9 中成功上传文件。这是我使用的代码 (PHP)：gist.github.com/jimthoburn/5810636 这是我上传的文件：img.wallpaperstock.net:81/…

标签： forms internet-explorer file-upload cross-browser internet-explorer-9

【解决方案1】：

正如 Graham 所做的那样，我认为这可能更多是服务器问题 - 而且我从来没有遇到过 IE9（或更高版本）中的文件上传问题 - 我猜你不想发布处理的 PHP 脚本的代码上传？

【讨论】：

见我上面对 Onur 的评论。

【解决方案2】：

如果没有发送任何数据，您可以通过服务器端脚本上的隐藏输入来检查发布数据。例如，如果您使用的是 php，则类似于

<? if($_POST['resume_form']=='resume_form'){
    //Do something
} ?>

或者您也可以使用 IE 的元兼容标签来呈现 IE8 之类的页面

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

【讨论】：

我知道表单可以正确处理提交，因为每天有数百名用户使用它而没有任何问题。唯一的问题很少来自 IE 用户。
我在我们的管理员登录页面上多次遇到同样的问题，我已经用兼容的元标记解决了它。但我知道在不同版本的 IE 中和呈现完全不同也许你的问题与像这样的东西。

【解决方案3】：

我建议设置X-UA-Compatible 元标记值，看看是否有任何不同。

有关可能的值，请参阅此问题：What does <meta http-equiv="X-UA-Compatible" content="IE=edge"> do?

也可能是页面在IE9中触发了非标准模式。我建议在 IE9 中打开页面，打开开发者工具，然后查看选择了哪些浏览器/文档模式。这可能会给你一个线索。请注意，在 IE8 之前不支持“enctype”表单属性，因此如果浏览器使用的是较旧的 doc 模式，则无法识别该属性。

【讨论】：

我不想这样做，因为虽然我支持 IE8，但我网站上的许多元素在 IE8 和 IE9 中呈现不同。这将创建一个相当草率的用户体验，因为任何 IE9 用户都会在该特定页面上临时“时间扭曲”回到 IE8。
我不一定建议在生产中使用该标签。我的意思是，在调试时尝试不同的值可能会帮助您缩小问题的根源。该错误可能是间歇性的，但您可以寻找更大的问题——错误的文档模式、错误的浏览器模式等...您可以在 IE9 中打开该站点，对吗？
我可以在 IE9 中进行测试，但问题并没有可靠地发生，因此很难通过这种方式在本地测试中学到任何确定的东西。过去我能够重现它一两次，但最近完全没有。
我了解问题是间歇性的。我的建议是寻找其他警告标志，例如错误的文档/浏览器模式。当某些东西在 IE8 中运行但在 IE9 中运行时，根本原因（根据我的经验）通常是文档/浏览器模式问题、浏览器嗅探不正确或 JavaScript 中使用的 API 已弃用/更改。我怀疑你的问题属于第一类。

【解决方案4】：

我能够通过在 setTimeout 中包装 jQuery 表单提交来解决这个噩梦般的问题：

$('#complete_profile input[type="submit"]').click(function(){
  setTimeout(function() {
    $('#complete_profile form').submit();
  }, 0);
});

但是，当表单确实提交时，这可能会导致重复提交，所以要小心。

【讨论】：

【解决方案5】：

好的，我宁愿留下评论而不是答案，但我还没有答案！

用户是否处于怪癖模式？大多数 IE 用户不知道 quirks 模式，并且在尝试刷新页面时可能不小心点击了它（而不是按 F5）。如果它是间歇性的，这可能就是原因。
从上往下看.. 在服务器端，您如何检查空字段？我更多的是在这里你经常寻找“”的 JS 行，null 和 undefined 我只是在想，也许怪癖模式正在发送一些模糊数据，你的服务器端错误检查丢失了，因为你没有看对于它，因此报告一切正常。

【讨论】：