zoukankan      html  css  js  c++  java
  • layui upload封装

    <link rel="stylesheet" href="layui/css/layui.css">
    <script src="js/jquery.min.1.11.3.js"></script>
    <script src="layui/layui.js"></script>
    
    <button type="button" class="layui-btn" id="test1">
      <i class="layui-icon">�</i>上传图片
    </button>
    
    <button type="button" class="layui-btn" id="uploadPic">
      <i class="layui-icon">�</i>上传图片2
    </button>
    
    <script> 
    	;(function(){
    		//定义构造函数
    		var Upfile = function(ele,opt){
    			this.defaults = {
    				//elem:'#uploadPic'	//绑定元素
    				elem:$(ele)	//绑定元素
    				,url:'http://localhost:8080/demo/import'	//上传接口
    				,method:'post'
    				,done:function(res){
    					console.log(JSON.stringify(res));
    				}
    				,error:function(res){
    					//上传失败
    					console.log(JSON.stringify(res));
    				}
    			}
    			this.options = $.extend({}, this.defaults ,opt);
    		};
    		
    		//定义方法
    		Upfile.prototype = {
    			init:function(){
    				var _this = this;
    				return layui.use('upload',function(){
    					var upload = layui.upload;
    					
    					//执行实例
    					var uploadInst = upload.render(_this.options);						
    				});
    			}
    		};
    		
    		//在插件中使用对象
    		$.fn.upfile = function(options){
    			var upfile = new Upfile(this,options);
    			return upfile.init();
    		}
    	})();
    	
    	//上传
    	$('#uploadPic').upfile({
    		done:function(res){
    			console.log(111);
    		}
    	});
    	$('#test1').upfile();
    
    </script>
    

      

  • 相关阅读:
    BETA 版冲刺前准备
    Alpha 事后诸葛亮(团队)
    Learn Docker(一)—软件安装与常规操作
    Alpha 答辩总结
    Alpha 冲刺 (10/10)
    Alpha 冲刺 (9/10)
    Alpha 冲刺 (8/10)
    Alpha 冲刺 (7/10)
    Alpha 冲刺 (6/10)
    团队作业-随堂小测(同学录)
  • 原文地址:https://www.cnblogs.com/kongge/p/9420554.html
Copyright © 2011-2022 走看看