zoukankan      html  css  js  c++  java
  • 文件上传plupload组件使用

    这段时间一直在使用文件上传,简要的介绍一下文件上传的组件使用,先上一段代码。

    var uploader = new plupload.Uploader(
    	{
    		//用来指定上传方式,指定多个上传方式请使用逗号隔开,默认即为此,可不写
    		runtimes : 'html5,flash,silverlight,html4',
    		//点击上传html标签的id,可以是a,button等
    		browse_button : 'hideBtn',
    		//服务器端的页面上传地址
    		url : url,
    		//文件的最大上传大小,不写该参数则上传文件大小无限制
    		max_file_size : '20mb',
    		//设置多项选择,默认为true,即可多选文件,功能为单选时需将此设为false
    		multi_selection : true,
    		//上传的文件生成一个唯一的文件名,默认为false,false时上传文件为本身的名字,true时自动生成其他名字
    		unique_names : true,
    		//可以使用该参数来限制上传文件的类型,大小等,该参数以对象的形式传入
    		filters : [
    			{title: "Image files", extensions: "jpg,gif,png,jpeg"},
    	                {title: "Zip files", extensions: "zip"},
    	                {title: "file files", extensions: "doc,docx,xls,xlsx,ppt,pptx,txt,pdf"}
    			],
    			//flash地址,swf文件,当需要使用swf方式进行上传时需要配置该参数
    			flash_swf_url : '../../../../sikns/js/Moxie.swf',
    			//silverlight文件,当需要使用silverlight方式进行上传时需要配置该参数
    			silverlight_xap_url : '../../../../sikns/js/Moxie.xap',
    			//当Plupload初始化完成后触发
    init : { //文件上传前触发 BeforeUpload : function(up, file){ /*事先做个校验,违反校验的情况下,将文件上传传输组件暂停*/ /*up.stop(); up.removeFile(file);*/ } }, //当文件添加到上传队列后触发(up为当前的plupload实例对象,files为一个数组,里面的元素为本次添加到上传队列里的文件对象) FilesAdded : function(up, files) { /*plupload.each(files,function(file) { document.getElementById('filelist').value += file.name+";"; });*/ //开始上传队列中的文件 uploader.start(); }, //会在文件上传过程中不断触发,可以用此事件来显示上传进度(up当前的plupload实例对象,file为触发此事件的文件对象) UploadProgress : function(up, file) { }, //传输完成后添加事件 UploadComplete : function(up,files){ } } }); //初始化Plupload实例 uploader.init();

      这段代码是文件上传的js部分,里面各个部分的函数注解的很清楚。

    调用这个js的部分按钮如下:

    <div class="input-group" style=" 100%">
        <input class="form-control ue-form" id="filelist" type="text"   placeholder="选择上传文件" readonly>
        <div class="input-group-addon ue-form-btn" id="inputfiles">
        <span class="fa fa-upload"></span>
        </div>
        <button id="hideBtn"></button>	
    </div>    
    

      

  • 相关阅读:
    路西法效应 和 数学公式输入
    coursera python
    epub java
    How do remove the CD / DVD install as a source for apt-get packages when installing new features?
    vmware player 去除full screen的bar
    Install VMware tools on Ubuntu 20.04 Focal Fossa Linux
    java poi for word
    handwriting ocr
    总结5.22PHP网络与变量
    总结5.12js代表练习题
  • 原文地址:https://www.cnblogs.com/longlyseul/p/12152105.html
Copyright © 2011-2022 走看看