首页 > 代码库 > Plupload插件使用整理

Plupload插件使用整理

Plupload

参考:

http://www.cnblogs.com/2050/p/3913184.html

http://www.plupload.com/docs/

js:

    //上传,配置基本参数,事件,实例化
    function initPlupload() {
      //配置上传
      vm.uploader = new plupload.Uploader({
        runtimes: ‘html5,flash‘,
        browse_button: ‘uploadify‘,
        container: document.getElementById(‘container‘),
        url: ‘/om/V1/console/file/uploadPlatformHelpBook‘,
        flash_swf_url: ‘../bower_components/plupload-2.3.1/js/Moxie.swf‘,
        silverlight_xap_url: ‘../bower_components/plupload-2.3.1/js/Moxie.xap‘,
        headers: {
          ‘Referer‘: ‘/bm/‘
        }
      });
      //初始化Plupload实例
      vm.uploader.init();
      //绑定文件添加到队列事件
      vm.uploader.bind(‘FilesAdded‘, function(up, files) {
        //删除上传队列中其他文件,只保留最近上传的文件
        var len = vm.uploader.files.length;
        vm.uploader.splice(0, len-1);
        plupload.each(vm.uploader.files, function(file) {
          $scope.$apply(function () {
            vm.upload_error = false;
            vm.fileUploadObj.fileId = file.id;
            vm.fileUploadObj.fileSize = file.size;
            vm.fileUploadObj.fileName = file.name;
            var filePath = file.name;
            vm.fileUploadObj.fileType = filePath.substring(filePath.lastIndexOf("."), filePath.length).toLowerCase();
          })
        })
      });
      //绑定文件上传完成事件
      vm.uploader.bind(‘FileUploaded‘, function(up, file, responseObject) {
        var data =http://www.mamicode.com/ $.parseJSON(responseObject.response);
        if (data.status === ‘SUCCESS‘) {
          vm.uploadEvent.uploadFileSuccess && vm.uploadEvent.uploadFileSuccess(data.result);
        } else {
          vm.uploadEvent.uploadFailed && vm.uploadEvent.uploadFailed(data.message);
        }
      });
    }

html:

    <span class="upload  fileinput-button" id= "container" ng-show="vm.insertSymbol == true">
      <a id="uploadify">浏览文件...</a>
    </span>

 

Plupload插件使用整理