Blueimp文件上传IE 8中没有发生任何事情
我在一个项目上使用blueimp文件上传插件,并且遇到了IE8的一些困难,主要是没有发生任何事情!
我的设置尽可能接近插件演示设置 – 文件包含在相同的顺序中,html结构只有很小的变化,css是相同的等等。
在其他浏览器+ ie9中,一切都按预期工作,但在ie8中,好像添加图像的按钮没有附加任何内容。
如果我上传ie9然后使用开发工具将文档类型切换到ie8,则会成功从服务器检索图像。
我很难显示完整的代码,因为该文档非常令人费解,但页面位于此处: http : //www.yoursplash.co.uk/index.php ? route = product / product&product_id = 108
这几乎是与文件上传相关的所有内容:
这些是我按此顺序包含的文件,以使插件工作
这是我自己的插件实现
'use strict'; $(document).on('ready', function () { $.ajax({ url: '/index.php?route=product/userimage&usetype=get', dataType: 'json', context: $('#fileupload')[0] }).done(function (result) { $(this).fileupload('option', 'done').call(this, null, {result: result}); if ($('#filesContainer > .template-download').length > 0) { $('a[href="#user-upload"]').removeClass('selected').siblings('a[href="#user-photos"]').addClass('selected'); $('#user-upload').hide().siblings('#user-photos').fadeIn(); }; }); }); $('#fileupload').fileupload( { url: '/index.php?route=product/userimage&usetype=put', type: 'POST', maxFileSize: 5000000, fileInput : '#imgUp', acceptFileTypes: /(\.|\/)(gif|jpe?g|png)$/i, process: [ { action: 'load', fileTypes: /^image\/(gif|jpeg|png)$/, maxFileSize: 5000000 // 20MB } ], filesContainer: '#filesContainer' }) .bind('fileuploadadded', function (e, data) { $('a[href="#user-upload"]').removeClass('selected').siblings('a[href="#user-photos"]').addClass('selected'); $('#user-upload').hide().siblings('#user-photos').fadeIn(); }) .bind('fileuploadcompleted', function (e, data) { return $('#filesContainer .uploadedImage').draggable({ containment : 'document', revert : true, appendTo : 'body', helper: function(e,ui){ return $('',{ src : $(e.target).data('src')}).css('width','150px'); } }).tooltip({ tooltipClass : 'image-gallery-tooltip' , position : { at: 'bottom center'} }); });
这是我的插件实现的HTML
任何帮助都会得到很好的接受 – 我很接近用这一个撕掉我的头发,因为似乎没有任何好的理由让它不起作用!
对于遇到与我在处理此问题时遇到的问题相同的问题,问题与BlueImp文件上传器无关,而是IE <9的安全功能,不允许对文件上传按钮进行编程“点击”。
问题的实际原因是我隐藏了表单输入,以便我可以呈现自己的样式“按钮”并使用jQuery触发对输入的单击 – 我的解决方案是使用CSS将表单输入’opacity设置为0 ,然后使用绝对定位将其放在我的“漂亮”按钮上。