Jquery 文件上传捕获完成上传操作

Question

我正在使用Jquery file upload by blueimp想要捕获文件上传后发生的操作。所以，这很好用

.on('change','input[type=file]',function(e)
{
    console.log('OOOOOOOOk');
})

但这对我不起作用，因为我需要在文件上传完成后执行操作。所以，在 docs我找到了这个解决方案:

var url = './fileUpload/jQuery-File-Upload/server/php/';
      $('#fileupload').fileupload({
          url: url,
          dataType: 'json',
          done: function (e, data) {
              $.each(data.result.files, function (index, file) {
                  $('<p/>').text(file.name).appendTo('#files');
              });
          },
          progressall: function (e, data) {
              var progress = parseInt(data.loaded / data.total * 100, 10);
              $('#progress .progress-bar').css(
                  'width',
                  progress + '%'
              );
          }
      }).prop('disabled', !$.support.fileInput)
          .parent().addClass($.support.fileInput ? undefined : 'disabled')
          .bind('fileuploadcompleted',function(e,data)
            {
              console.log('eventFinished');
            });

但是上传后我在控制台中没有看到 eventFinished 字符串，而是看到 OOOOOOOk。那么我怎样才能捕捉到这个事件呢？

Answer 1

您正在将“fileuploadcompleted”事件绑定(bind)到实际元素的父级，因此请尝试以这种方式重新排列代码。

var url = './fileUpload/jQuery-File-Upload/server/php/';
  $('#fileupload').fileupload({
      url: url,
      dataType: 'json',
      done: function (e, data) {
          $.each(data.result.files, function (index, file) {
              $('<p/>').text(file.name).appendTo('#files');
          });
      },
      progressall: function (e, data) {
          var progress = parseInt(data.loaded / data.total * 100, 10);
          $('#progress .progress-bar').css(
              'width',
              progress + '%'
          );
      }
  }).bind('fileuploadcompleted',function(e,data)
        {
          console.log('eventFinished');
        }).prop('disabled', !$.support.fileInput)
      .parent().addClass($.support.fileInput ? undefined : 'disabled');