blueimp jQuery的文件上传未触发(blueimp jQuery file upload

2019-09-21 01:43发布

我试图使用blueimp文件上传插件异步上传图片,但是当我尝试上传到什么也没有发生。 回调函数没有被所有触发。 我使用此功能可将文件上传到文件输入绑定。

var initFileUpload = function (gender) {
//Used to bind fileupload plugin and send files

//bind file upload
$('#add_form').fileupload({
    namespace: gender+'_image',
    singleFileUploads: true,
    formData: [{name:'gender', value: gender}],
    fileInput: $("#"+gender+'_image'), 
    done: function(e, data){
        alert('success '+data.result);
    }

});
//Bind event callbacks
$('#add_form').bind('fileuploadsend', function (e, data) {
    console.log('sent');
});
$('#add_form').bind('fileuploaddone', function (e, data) {
    console.log('done');
});
$('#add_form').bind('fileuploadfail', function (e, data) {
    console.log(data.result);
});
$('#add_form').bind('fileuploadalways', function (e, data) {
    console.log(data.result);
});

}

这是由多个文件上传教程灵感在这里。 我做这种方式,因为我有不同的名称,3个不同的输入。 我然后手工烧制的发送功能我Ajax调用的内部,或企图。

$.ajax({
      type: "POST",
      url: "/manage/processadditem",
      data: $("#add_form").serialize(),
      dataType: "html",
      success: function( response, textStatus, XHR )
      {
        if(response.indexOf('invalid') >= 0 || response.indexOf('Exception') >= 0){
            //Show them their errors
            alert(response);
        }
        else{
            //Upload item images
            //Send files
            $('#add_form').fileupload('send', {fileInput: $("#neutral_image"), url: '/manage/items/itemimage/test' });
            $('#add_form').fileupload('send', {fileInput: $("#male_image"), url: '/manage/items/itemimage/test' });
            $('#add_form').fileupload('send', {fileInput: $("#female_image"), url: '/manage/items/itemimage/test' });
            alert('should have uploaded image to cdn.completeset.com/items/test_nla.jpg if gender was neutral');
        }

      },
      error: function(jqXHR, textStatus, errorThrown){
        alert('An error occurred, please try again later.');
      }
    });

我的文档中找到此节下纲领性文件上传,您可以使用发送方法与一条线,如手动发送文件$('#fileupload').fileupload('send', {files: filesList}); 所以这就是我想要用它来发送文件。 不幸的是我没有得到任何形式的任何的回调函数应答的一切,我不知道为什么。

Answer 1:

我刚刚结束了与malsup形式插件怎么回事。 http://malsup.com/jquery/form/#ajaxForm与blueImp挣扎两天后,我得到了这一个,并只有几分钟运行。



Answer 2:

试试这个,你可以在这里下载工作示例;

jQuery的Blueimp文件上传



文章来源: blueimp jQuery file upload not being triggered