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

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

当一个元素是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后问题解决

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

Bootstrap 模态对话框
模态对话框 JavaScript内置了 3 种对话框:alert().prompt().confirm().alert() 只是一个简单的提示对话框,prompt() 可以接受用户输入的信息,conf ...
自定义tag打包Bootstrap模态对话框并动态加载传值
文章目录 Bootstrap的模态对话框自定义tag文件如下: 加载方法注意事项动态加载的好处 Bootstrap的模态对话框为了复用bootstrap的模态框,将其封装入自定义tag文件中, ...
Bootstrap 模态对话框只加载一次 remote 数据的解决办法
前端框架 Bootstrap 的模态对话框,可以使用 remote 选项指定一个 URL,这样对话框在第一次弹出的时候就会自动从这个地址加载数据到 .modal-body 中,但是它只会加载一次,不过 ...
选择文件对话框、保存文件对话框、选择文件夹对话框
选择文件对话框 // 设置图像文件过滤格式CString lv_strFilterAll = _T("所有文件(*.*)|*.*||");CString lv_strFilterJ ...
Bootstrap 模态对话框只加载一次 remote 数据的解决办法转载
http://my.oschina.net/qczhang/blog/190215 摘要前端框架 Bootstrap 的模态对话框,可以使用 remote 选项指定一个 URL,这样对话框在第一次弹 ...
php按钮打开文件选择框,在Select file(选择)页面单击Select file(选择文件)按钮
第1步,运行WordFix,并单击"Start(开始)"按钮,如图所示. 第2步,进入Word文档恢复向导,在"Select file(选择)"页面单击&quo ...
java swt 文件选择,Java SWT文件对话框中的文件多选
//Java文件对话框实现文件多选主要有三种方式.我在这里举三个例子 //他们分别对应Java的三个GUI可视编程框架,这里推荐大家使用Swing或者SWT的 //1.AWT FileDialog d ...
C#中选择文件的例子
C#中文件选择例子 OpenFileDialog fileDialog = new OpenFileDialog(); // fileDialog.InitialDirectory = "d ...
MFC_选择目录对话框_选择文件对话框_指定目录遍历文件
选择目录对话框 void C资源共享吧视频广告清理工具Dlg::OnBnClickedCls() {// 清空编辑框内容m_Edit.SetWindowTextW(L"");m_E ...

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

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

最新文章

热门文章