无法使用 JQuery 表单插件在 Internet Explorer 中上传文件答案

【问题标题】：Can't upload file in Internet Explorer using JQuery Form plugin无法使用 JQuery 表单插件在 Internet Explorer 中上传文件
【发布时间】：2009-09-29 10:56:03
【问题描述】：

我正在使用 JQuery Form Plugin 与 PHP 一起上传文件，在 Firefox 中一切正常，但在 Internet Explorer 中，如果我提交表单，则不会执行任何操作。

我的代码在下面

<script type="text/javascript">
    <!--
    $(document).ready(function() { 
        var options = {
        target: '#message',
        url:'../includes/ajax/import.php?import=1',
        beforeSubmit: function() {
            $('#uploader').html('<div style="padding-top:10%"><center><img src="../domain/images/ajax-loader.gif" border="0" /></center></div>');
            $('#message').toggle();
        },
        success:  function() {
            $("#message").removeClass("message").addClass("messageResponse");
            $('#message').toggle();
            $('#uploader').html('');
        }
        };
        $('#upload').ajaxForm(options);

    }); 


    //-->
</script>

<div id="message" class="message">
    <form name="upload" id="upload" action="#" method="POST" enctype="multipart/form-data">
        <table cellpadding="4" cellspacing="4" border="0">
            <tr>
                <td colspan="3"><h1>Map Clients <i>(Import CSV File)</i></h1></td>
            </tr>
           <tr>
                <td class="fieldLabel" nowrap>File:</td>
                <td nowrap><input type="file" name="fileToUpload" id="fileToUpload" />&nbsp;*</td>
                <td nowrap id="errorFile" class="error"></td>
            </tr>
            <tr>
                <td nowrap colspan="3"><button id="mapClients">Map Clients</button></td><td nowrap id="errorFile" class="error"></td>
            </tr>   
        <tr>
        <td colspan="3"><input type="hidden" value="1" id="type" name="type" /></td>
        </tr>
        </table>
    </form>
</div>
<div id="uploader"></div>

现在我的问题是，当我单击表单提交按钮时，我无法弄清楚为什么 IE 7 没有执行任何操作

【问题讨论】：

标签： php jquery jquery-plugins

【解决方案1】：

我似乎记得遇到过同样的问题。试试这个：

$(document).ready(function() { 
    var options = {...
    /*abridged for clarity*/

    $('#upload').submit(function() {
        $(this).ajaxSubmit(options);
        return false;
    });
});

【讨论】：

长镜头，但尝试将您的表单命名为与 ID 不同的名称
执行了以下操作，
仍然没有

【解决方案2】：

我找到了问题

在我的 HTML 中，我有类似的东西

        <tr>
            <td nowrap colspan="3"><button id="mapClients">Map Clients</button></td><td nowrap id="errorFile" class="error"></td>
        </tr>

我改成

        <tr>
            <td nowrap colspan="3"><input type="submit" id="mapClients" value="Map Clients" /></td><td nowrap id="errorFile" class="error"></td>
        </tr>

问题解决了

【讨论】：

【解决方案3】：

我在 ie8 中遇到了 JQuery Form Plugin 的问题。启动“ajax 表单”的那段代码位于稍后更新的“动态 div”中。将该调用移至主页让 ie8 为我工作。

【讨论】：

【解决方案4】：

IE 也有类似的问题。就我而言，问题正在发生，因为我在 beforeSend 中禁用了文件输入元素 (input[type=file])（出于美观和可用性原因）。只有 IE 存在输入元素被禁用的问题。

【讨论】：