Uncaught Error: cannot call methods on fileupload prior to initialization; attempted to call method

johnhuster的分享

发布于 2022-03-28 14:02:21

9590

最近在使用计划在blueimp/jQuery-File-Upload插件来上传文件，想在上传前弹出确认对话框，用户点击‘确定’后方可上传文件，最初计划在该插件的add方法：--该方法使用如下

add: function (e, data) {
    }

中弹出对话框，使用时将data作为参数传入弹出对话框的处理函数，在确认后调用data.submit()来完成提交，此时浏览器输出了Uncaught Error: cannot call methods on fileupload prior to initialization; attempted to call method 异常，在网上查找无果，所以记录自己的处理方法如下，希望能帮到需要的朋友们：

注：fileupload1、fileupload定义为：

该元素设置为隐藏，真正上传文件是通过该元素完成！！！

<span class="btn btn-success fileinput-button">
 <i class="glyphicon glyphicon-plus"></i>
 <span>选择上传文件</span>
 <input id="fileupload" type="file" name="filedata">
 <input id="fileupload1" type="file" class="hidden"name="filedata">
 </span> 
//上传文件函数
function uploadFiles(files){
   var tmp = BootstrapDialog.show({
        title: '提示',
        message: '确定上传文件：'+files.files[0].name+'吗?',
        buttons: [{
            label: '确定',
            cssClass: 'btn-danger',
            action: function (dialogItself) {
                dialogItself.close();
 $('#fileupload1').fileupload({
 url: xxxxxx,
 autoUpload:true,
 add: function (e, data) {
data.submit();
   },
   done: function (e, data) {
   var result = data.result;
   if(result.success){
   showResult(result.data);
   }else{
   tips("提示",result.message);
   }  
       }
 });   
 $('#fileupload1').fileupload('add', {files: files.files}); 
            }
        }]
    }); 
 }
 
//上传文件点击按钮
$('#fileupload').fileupload({
 url: xxxxx,
 autoUpload:true,
 add: function (e, data) {
   uploadFiles(data);
 }
 });

这说明：不能在fileupload插件的add方法中弹出对话框！！！！否则后面上传

本文参与腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。

原始发表：2016/12/05 ，如有侵权请联系 cloudcommunity@tencent.com 删除

add