Question

IE8下使用plupload上传文件，触发选择文件框时无反应，大家谁有遇到过吗？

Answer 1

您好，<div class="wraper">
<div class="btn-wraper">
<input type="button" value="选择文件..." id="browse1" />
<input type="button" value="选择文件..." id="browse2" />
<input type="button" value="开始上传" id="upload-btn" />
</div>
<ul id="file-list">
</ul>
</div>

<script>
$(document).ready(function(){
$(":input").click(function(){
var uploader = new plupload.Uploader({ //实例化一个plupload上传对象
browse_button : $(this).attr("id"),
url : 'upload.php',
flash_swf_url : 'js/Moxie.swf',
silverlight_xap_url : 'js/Moxie.xap',
filters: {
mime_types : [ //只允许上传图片文件和rar压缩文件
{ title : "图片文件", extensions : "jpg,jpeg,gif,png,bmp" },
{ title : "RAR压缩文件", extensions : "rar,zip" }
],
max_file_size : '10mb', //最大只能上传100kb的文件
prevent_duplicates : true //不允许队列中存在重复文件
}
});

uploader.init(); //初始化

//绑定文件添加进队列事件
uploader.bind('FilesAdded',function(uploader,files){
for(var i = 0, len = files.length; i<len; i++){
var file_name = files[i].name; //文件名
//构造html来更新UI
var html = '<li id="file-' + files[i].id +'"><p class="file-name">' + file_name + '</p><p class="progress"></p></li>';
$(html).appendTo('#file-list');
}
});

//绑定文件上传进度事件
uploader.bind('UploadProgress',function(uploader,file){
$('#file-'+file.id+' .progress').css('width',file.percent + '%');//控制进度条
});

//上传按钮
$('#upload-btn').click(function(){
uploader.start(); //开始上传
});
});
//});
</script>
这个控件每次实例化都会自动生成一个INPUT type=file,所以会出现点几次出弹N-1次,第一次点击没反应是因为没有生成INPUT按钮。
可以改成页面加载时只初始化一次。

追问

我现在的问题是那个选择上传文件的框框都弹不出来，无论点击多少次。

Answer 2

这里有个大坑，就是在PC端浏览器模拟移动端样式时，plupload插件自动判定为移动端，会调用移动端的选择文件，所以在PC端没有反应也不会报错。

不知道别人是否遇到了这种情况，反正是坑了我好久

Answer 3

因为你在按钮没有渲染或初始化之前就绑定了这个按钮，意思就是这个按钮还没有出生，你就给他喂奶了