Question

我在使用插件jquery文件上传到ie9时遇到问题 - 这个脚本在firefox，chrome和edge上工作正常。

我的问题是被命中的添加功能但功能data.submit（）没有将文件发布到服务器::没有发送到服务器的数据包＆amp;调试控制台中没有错误。

这是我的HTML：

<form id="upload" method="post" action="upload"
    encoding="multipart/form-data" enctype="multipart/form-data">
    <div id="drop">
        Drop Here <a>Browse</a> <input type="file" id="upl" name="upl"
            multiple="multiple" />
    </div>

    <ul>
        <!-- The file uploads will be shown here -->
    </ul>

</form>
<script src="/assets/pages/scripts/uploadplugin/js/jquery.knob.js"></script>
<!-- jQuery File Upload Dependencies -->
<script src="/assets/pages/scripts/uploadplugin/js/jquery.ui.widget.js"></script>
<script src="/assets/pages/scripts/uploadplugin/js/jquery.fileupload.js"></script>
<script src="/assets/pages/scripts/uploadplugin/js/jquery.iframe-transport.js"></script>
<!--[if lt IE 10]> <script src="/assets/pages/scripts/uploadplugin/js/jquery.xdr-transport.js"></script> <![endif]-->
<script src="/assets/pages/scripts/uploadplugin/js/script.js"></script>

这是script.js

// Initialize the jQuery File Upload plugin
$('#upload').fileupload({

    forceIframeTransport: !!ie,

    // This element will accept file drag/drop uploading
    dropZone: $('#drop'),
    autoUpload: true,
    // This function is called when a file is added to the queue;
    // either via the browse button, or via drag/drop:
    add: function (e, data) {

        var tpl = $('<li class="working"><input type="text" value="0" data-width="48" data-height="48"'+
        ' data-fgColor="#0788a5" data-readOnly="1" data-bgColor="#3e4043" /><p></p><span></span></li>');

        // Append the file name and file size
        tpl.find('p').text(data.files[0].name)
        .append('<i>' + formatFileSize(data.files[0].size) + '</i>');

        // Add the HTML to the UL element
        data.context = tpl.appendTo(ul);

        // Initialize the knob plugin
        tpl.find('input').knob();

        // Listen for clicks on the cancel icon
        tpl.find('span').click(function(){

            if(tpl.hasClass('working')){
                jqXHR.abort();
            }

            tpl.fadeOut(function(){
                tpl.remove();
            });

        });

        // Automatically upload the file once it is added to the queue
        var jqXHR = data.submit();
        console.dir(jqXHR);
        console.log(jqXHR.state());

    },

    progress: function(e, data){

        // Calculate the completion percentage of the upload
        var progress = parseInt(data.loaded / data.total * 100, 10);

        // Update the hidden input field and trigger a change
        // so that the jQuery knob plugin knows to update the dial
        data.context.find('input').val(progress).change();

        if(progress == 100){
            data.context.removeClass('working');
        }
    },
    done: function(e, data){
        var r = data.result;

        var tmp = $('<div class="row"><div class="col-md-12"><div class="portlet box red"><div class="portlet-title"><div class="caption"><i class="fa fa-gift"></i>Portlet </div><div class="tools"><a href="javascript:;" class="collapse"></a><a href="#portlet-config" data-toggle="modal" class="config"></a><a href="" class="fullscreen"></a><a href="javascript:;" class="reload"></a></div><ul class="nav nav-tabs"><li><a href="#portlet_tab_3" data-toggle="tab"> Tab 3 </a></li><li><a href="#portlet_tab_2" data-toggle="tab"> Tab 2 </a></li><li class="active"><a href="#portlet_tab_1" data-toggle="tab"> Tab 1 </a></li></ul></div><div class="portlet-body"><div class="tab-content"><div class="tab-pane active" id="portlet_tab_1"><p> Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.ut laoreet dolore magna ut laoreet dolore magna. ut laoreet dolore magna. ut laoreet dolore magna. </p></div><div class="tab-pane" id="portlet_tab_2"><p> Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmodtempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo. </p></div><div class="tab-pane" id="portlet_tab_3"><p> Ut wisi enim ad btn-smm veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. </p></div></div></div></div></div></div>');
        tmp.appendTo(resultdiv);
        console.log(r);
    },
    fail:function(e, data){
        // Something has gone wrong!
        console.log(data.jqXHR.responseText);
        console.dir(data);
        data.context.addClass('error');
    },
    processalways: function(e,data){
        console.dir(data);
        if (data.files.error) alert(data.files[0].error);
    }

});

没有任何功能完成，失败，成功和进程都被击中。提前谢谢。

ie9的jquery文件上传问题

0 个答案: