Question

我遇到了图片上传功能的问题。我使用plupload上传文件与jQuery ui模式对话框。 Ii在Firefox和Chrome上运行良好，但在IE浏览器上，它正在打开文件选择对话框，但文件没有上传。它也没有显示任何错误。

我正在使用以下代码：

  var insert_image_dialogOpts = {
                autoOpen: false,
                modal: false,
                resizable: true,                    
                width: 650,                 
                show: 'blind',
                title: 'Insert Image'
            };
        jQ('#insertimagebox').dialog(insert_image_dialogOpts); 
        jQ('#insert_image_dialog').click(function() {
            jQ('#insertimagebox').dialog('open');
            return false;   
        });         

        uploadInsertImage = new plupload.Uploader({
            runtimes: 'html5,flash,gears',
            browse_button: 'insertImage',
            container: 'uploadImage',
            url: '/upload',
            multipart_params: {
                'fancy_upload': '1',
                'insert_image': '1',                    
                'action': 'doUpload',
                'forum': forum,
                'uid': uid,
                'pid': pid,
                'timestamps': timestamps                                
            },
            multi_selection: true,
            flash_swf_url: '/tools/plupload.flash.swf',
            silverlight_xap_url: '/tools/plupload.silverlight.xap',
            filters: [{
                title: "Image files",
                extensions: "jpg,gif,jpeg,jpe,png"
            }]

        });
        // General settings
        uploadInsertImage.init();           
        // Event for each file added
        uploadInsertImage.bind('FilesAdded', function(up, files) {
                jQ.each(files, function(i, file) {                  
                jQ('#imagesInserted').append('<li class="file" id="'+file.id+'" style="float:left;cursor:pointer;margin:0px;padding:0px;list-style-type:none;font-size:10px;"><span id="fileProgress" onclick="jQuery(this).html(\'\')"><span style="float:left;" id="' + file.id + '">' + file.name + '' + '</span><div id="' + file.id + 'progress" style="width:9em; margin-top:5px; height:.6em;float:left"></div><a id="attachCancel' + file.id + '" href="javascript:;" onClick="stopUpload(\'' + file.id + '\');">Cancel </a></span><br></li>');
                jQ('#' + file.id + 'progress').progressbar({
                    value: files.percent
                }).append('<div style="line-height:8px; text-align:center; font-size:10px;">Uploading...</div>');                   
            });             

            uploadInsertImage.start();          
                up.refresh();   // Reposition Flash/Silverlight
            });

请帮忙！

Answer 1

谢谢大家！

现在我的问题已修复。我使用下面的代码打开jquery ui模式对话框，并使用plupload库正常工作。

     dialog = jQ('#insertimagebox').dialog({
     autoOpen: false,
     width: 650,
     modal: false,   
     title: 'Upload file',
     closeText: 'Close'  
     });

     jQ('#insert_image_dialog').bind('click', function (event) {
        event.preventDefault();
        jQ('#insertimagebox').dialog('open')
     });

您还可以从github获取完整代码： https://github.com/ljosa/plupload/blob/jquery_ui_dialog/examples/jquery_ui_dialog.html

谢谢！

Answer 2

查看你的代码我发现我的运行时和你的运行时间存在差异。我认为你在运行时缺少的银光（这是微软喜欢的那个）

我包含了我的代码（仅供参考）

    function initializeUploaders() {
        $('#photoUploader').pluploadQueue({

            runtimes : 'html5,flash,silverlight,html4',
            max_file_size : '10mb',
            unique_names : false,
            filters : [
                {title : "Image files", extensions : "jpg,gif,png"}
            ],
            flash_swf_url : '<%= ResolveUrl("~/Resources/Scripts/plupload.flash.swf") %>',
            dragdrop : false,
            urlstream_upload : true,
            silverlight_xap_url : '<%= ResolveUrl("~/Resources/Scripts/plupload.silverlight.xap") %>',
            preinit : {
                UploadFile: function(up, file) {
                    up.settings.url = 'UploadPhoto.ashx?workOrderId=' + $('#hdfWorkOrderId').val();                     
                }
            },
            init : {
                FileUploaded: function(up, file, info) {
                    if (up.total.queued == 0) {
                        <%=ClientScript.GetPostBackEventReference(udpWorkOrder, "")%>;                            
                    }
                }
            }
        });
 }

Answer 3

PlUpload使用自己的代码对按钮及其功能进行了更新。如果要绕过该代码，则应编辑PlUpload中的代码。那编码的级别比我能做的要高。

PlUpload生成如下代码：

<div class="plupload_buttons">
    <a href="#" class="plupload_button plupload_add" id="photoUploader_browse" style="position: relative; z-index: 0;">Add files</a>
    <a href="#" class="plupload_button plupload_start plupload_disabled">Start upload</a>
</div>

检查您的浏览器HTML代码是否符合上述条件。如果不知道问题出在哪里。

认为我能想到的唯一方法是找到一个包含IE的示例，并从那里编写它到您的自定义首选项。对不起，我不能更多的帮助。

使用Jquery UI模式对话框上传的plupload文件无法在IE浏览器上运行

3 个答案: