webuploader在bootstrap模态对话框中选择文件按钮无效的问题

来源:互联网 发布:智睿高清网络电视官网 编辑:程序博客网 时间:2024/05/02 02:42

搜了很多,网上主要的说法是

当一个元素是hidden时,addbutton绑定是会失败的,所以单击选择文件按钮就无效了

而bootstrap模态框一开始是隐藏的,因此必须在其显示完毕后才可以初始化webuploader

http://www.cnblogs.com/guohu/p/6483043.html

可参考上述帖子内容解决


var uploader;//在点击弹出模态框的时候再初始化WebUploader,解决点击上传无反应问题$("#myModal").on("shown.bs.modal",function(){    uploader = WebUploader.create({        swf : '/web/public/Uploader.swf',        server : $("#jumicontextPath").val()+'/common/file/upload',// 后台路径        pick : '#filePicker', // 选择文件的按钮。可选。内部根据当前运行是创建,可能是input元素,也可能是flash.        resize : false,// 不压缩image, 默认如果是jpeg,文件上传前会压缩一把再上传!        chunked : true, // 是否分片        duplicate:true,//去重, 根据文件名字、文件大小和最后修改时间来生成hash Key.        chunkSize : 52428 * 100, // 分片大小, 5M        /*    fileSingleSizeLimit:100*1024,//文件大小限制*/        auto : true,        // 只允许选择图片文件。        accept: {            title: 'Images',            extensions: 'gif,jpg,jpeg,bmp,png',            mimeTypes: 'image/jpg,image/jpeg,image/png'        }    });     // 文件上传成功,给item添加成功class, 用样式标记上传成功。    uploader.on('uploadSuccess', function (file,response) {        var fileUrl = response.data.fileUrl;        //TODO        $("#responeseText").text("上传成功,文件名:"+response.data.fileName);    });     // 当文件上传出错时触发    uploader.on('uploadError', function (file) {        $("#responeseText").text("上传失败");    });     //当validate不通过时触发    uploader.on('error', function (type) {        if(type=="F_EXCEED_SIZE"){            alert("文件大小不能超过xxx KB!");        }    });});
//关闭模态框销毁WebUploader,解决再次打开模态框时按钮越变越大问题$('#myModal').on('hide.bs.modal', function () {    $("#responeseText").text("");    uploader.destroy();});



但是我使用上面的办法仍然无效
后来参考了这里http://www.jzdlink.com/studynotes/201703161247.html
我用的上传文件的元素是超链接,改成div后问题解决

阅读全文
0 0
原创粉丝点击