javascript控件开发之可见控件(1)

最新推荐文章于 2024-05-15 15:15:50 发布
最新推荐文章于 2024-05-15 15:15:50 发布
阅读量114 收藏
点赞数
分类专栏： 控件开发 文章标签： javascript ui html 控件 框架 ViewUI
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/iteye_20428/article/details/82576991
版权
上一篇写了第一个基础控件，本篇我们开始编写可见控件com.ui.window.js,首先，在component文件夹下面添加ui文件夹，并在ui文件夹下添加com.ui.window.js文件，并添加初始化方法，init、create、render、_doResize方法
window类继承com.baseObject类，
init 重写基类的方法，主要添加dom占位元素，是否由dom创建标志两个参数
并从dom元素对象中获取option属性，合并到类option属性并调用渲染方法，
create 为基类调用的创建方法，用于初始化变量，比如键盘事件，鼠标事件，宽，高等属性
render 为跟据属性，渲染或重构dom元素
afterRender为渲染后函数，
_doResize 则为跟据宽，高等属性，设置dom元素的位置或宽高等，
因为dom元素多需要添加样式，这里写了针对样式控制的方法，setStyle, addStyle, clearStyle, delStyle，另外，dom元素都有margin, padding, border等属性，为了续方便，添加了简易的读取边距函数，
这里我们有些函数用到了下划线开头，我们这里定义这种函数为私有函数，
详细代码如下， 

/**
 * 可见窗口基类.
 * 创建: QZZ
 * 日期: 2014-04-06
 */
(function(undefined) {	
	nameSpace("com.ui");

	com.ui.window = Extend(com.baseObject, {
            /**
		 * 初始化函数.
		 * @param option 属性
		 * @param control DOM元素
		 * @param isDom 是否dom元素, 如果是在html页面上布局，
		 *                            则option已自动解析，
		 */
	    init:function(option, control, isDom) {		    
		    this.base(option);	
		    if(typeof control != "undefined") {
			    //获取dom元素
		    	this.thisWindow = control;
		    	if(!isDom) {
				    //读取属性
		    		var op = control.attributes.option;
					if(typeof op != "undefined") {
						op = eval("(" + op.nodeValue + ")");
					}
					if(typeof op != "undefined") {
						for(var key in op) {
							this.option[key] = op[key];
						}
					}
		    	}
				this.name = control.id || control.name;
		    }
		    this.logInfo("window.init");
		    this.render();
		    this.afterRender();
	    },
		/**
	     * 对象创建函数.
	     */
	    create:function() {
		    this.base();
		    this.className = "com.ui.window";
		    this.logInfo("window.create");
		    this.eventList = {};
		    this.keyBoard = {
		        DOWN:40,
		        UP:38,
		        LEFT:37,
		        RIGHT:39,
		        ENTER:13,
				C:10,
				V:86,
				X:88,
				Z:90
		    };
			this.mouseType = {mtLeft : "L",
		                      mtRight: "R"};
		    this.parent;
			//处理宽高，顶点，左边
			this.option.top = this._domValue(this.option.top, 0);
		    this.option.left = this._domValue(this.option.left, 0);
			//绝对顶、左点
			this._atop = null;
		    this._aleft = null;
			//宽高
			this.option.width = this._domValue(this.option.width, 10);
		    this.option.height = this._domValue(this.option.height, 10);
			//内外边距
			this.option.margin = this._domValue(this.option.margin,0);
			this.option.padding = this._domValue(this.option.padding,0);	
            this.option.border = this.option.border||"";
		    this.focus = false;
		    //面板选择
		    this.hasSelect = false;
			this._eventList = {};
		    this.body = null;
	    },
		/**
	     * 渲染函数.
	     */
	    render:function() {
	    	this.logInfo("window.render");
	    	if(typeof this.thisWindow == "undefined") {    	
	    	    this.thisWindow = this.createElement("div");
	    	}	    	    
	    	this.setStyle(this.thisWindow, "winStyle");
			//处理大小变量
	    	if(this._hasResize()) {
	    	    this._doResize();
	    	}
	    },
		/**
	     * 渲染后执行.
	     */
	    afterRender:function(){
	    	var _this = this;
	    	this.thisWindow.onmouseup = function() {
	        	_this.hasSelect = true;
	        };
	        //系统事件
	        this._sysEvent();
	    },
		/**
	     * 执行变化调整事件.
	     * @return 返回状态
	     */
	    _doResize:function() {	    	
	    	if(!this._update) return false;
	    	this.logBegin("_doResize");
	    	//边距处理
	    	if(this.thisWindow.style.margin != this.option.margin + "px") {
	    		this.thisWindow.style.margin = this.option.margin + "px";
	    	}
	    	if(this.thisWindow.style.padding != this.option.padding + "px") {
	    		this.thisWindow.style.padding = this.option.padding + "px";
	    	}
			if(this.option.border !== "") {
	    		this.thisWindow.style.border = this.option.border;
	    	}
	    	//计算长宽
	    	var bw = this._getRectWidth();
	    	var bh = this._getRectHeight();
	    	if(bw <= 0) {
	    		bw = 1;
	        }
	    	bw += "px";
	    	if(bh <= 0) {
	    		 bh = 1;
	    	}
	    	bh += "px"
	    	var isResize = false;
	    	var msg = "";
	    	//处理大小
	    	if(this.thisWindow.style.width != bw) {
	    		msg += this.getName() + " width:" + this.thisWindow.style.width + " to " + bw + " ";
	    	    this.thisWindow.style.width = bw;
	    	    isResize = true;
	    	}
	    	if(this.thisWindow.style.height != bh) {
	    		msg += this.getName() + " height:" + this.thisWindow.style.height + " to " + bh + " ";
	    	    this.thisWindow.style.height = bh;
	    	    isResize = true;
	    	}	    	
	    	this.logEnd("_doResize " + msg);
	    	return isResize;
	    },
	    /**
	     * 样式设置.
	     * @param tab 元素
	     * @param className 样式名
	     * @param doCss 设计样式
	     */
	    setStyle:function(tab, className, doCss){
	    	doCss = doCss || true;
	    	if(className instanceof Array) {
	    		//在元素上设置格式数组对象
	    		tab.cssAry = className;
	    		var cn = className.join(" ");
	    		if(tab.className != cn && doCss) {
	    			tab.className = cn;
	    		}
	    	} else {
	    		//直接设置样式
		    	if (tab.className != className) {
		    		if(doCss) {
		                tab.className = className;
		            }	            
		            tab.cssAry = [className];
		        }
	    	}
	    },
	    /**
	     * 添加样式.
	     * @param tab 元素
	     * @param className 样式名
	     * @param doCss 处理样式
	     */
	    addStyle:function(tab, className, doCss) {
	    	doCss = doCss || true;
	    	if(typeof tab.cssAry != "undefined") {
	    		//检查重复
	    		var i = 0, len = tab.cssAry.length
	    		for(; i < len; i++) {
	    			if(tab.cssAry[i] == className) {
	    				break;
	    			}
	    		}
	    		//添加样式
	    		if(i >= len) {
	    			tab.cssAry.push(className);
	    		}
	    	} else {
	    		tab.cssAry = [className];
	    	}
	    	if(doCss) {
	    		//设计样式到dom
	    		var ncs = tab.cssAry.join(" ");
	    		if(ncs !== tab.className) {
	    	        tab.className = ncs;
	    		}
	    	}
	    },
	    /**
	     * 清除样式.
	     * @param tab 元素
	     * @param doCss 执行样式.
	     */
	    clearStyle:function(tab, doCss) {
	    	if(typeof tab.cssAry != "undefined") {
	    		tab.cssAry = [];
	    	}
	    	doCss = doCss || true;
	    	if(doCss && tab.className !== "") {
	    	    tab.className = "";
	    	}
	    },
	    /**
	     * 删除样式.
	     * @param tab 元素
	     * @param className 样式名
	     * @param doCss 处理样式
	     */
	    delStyle:function(tab, className, doCss) {
	    	if(typeof tab.cssAry != "undefined") {
	    		//查找需要删除的样式名
	    		var i = 0, len = tab.cssAry.length;
	    		for(; i < len; i++) {
	    			if(tab.cssAry[i] == className) {
	    				break;
	    			}
	    		}
	    		if(i < len) {
	    			tab.cssAry.splice(i, 1);
	    		}
	    	}
	    	doCss = doCss || true;
	    	if(doCss) {
	    		var ncs = tab.cssAry.join(" ");
	    		if(ncs !== tab.className) {
	    	        tab.className = ncs;
	    		}
	    	}
	    },
		/**
		 * 解析dom元素的值.
		 * @param value 值
		 */
		_domValue:function(value, defValue) {
		    var vt = typeof value;
			var defValue = defValue || 0;
		    if(vt == "string") {
	    		value = value.replace(/px/, "");
	    		if(this.isNotEmpty(value) && !isNaN(value)) {
	    			value = parseInt(value, 10);
	    		} else {
				    value = defValue;
				}
	    	} else if(vt != "number") {
			    value = defValue;
			}
			return value;			
		},
		/**
	     * 大小是否发生变化.
	     */
	    _hasResize:function() {
	    	return !(this.thisWindow.style.top == this.option.top + "px" 
	    	         && this.thisWindow.style.left == this.option.left + "px"
	    	             && this.thisWindow.style.width == this._getRectWidth() + "px"
	    	                 && this.thisWindow.style.height == this._getRectHeight() + "px");
	    },
		/**
	     * 获取内宽.
	     * @return 返回宽度
	     */
	    _getRectWidth:function() {
	    	return this.getWidth() - (this._getBorderLeft() 
 	       + this._getBorderRight() 
	       + this._getMarginLeft()
	       + this._getMarginRight()
	       + this._getPaddingLeft()
	       + this._getPaddingRight());
	    },
	    /**
	     * 获取内高.
	     * @return 返回高度
	     */
	    _getRectHeight:function() {
	    	return this.getHeight() - (this._getBorderTop() 
 	       + this._getBorderBottom()
	       + this._getMarginTop() 
	       + this._getMarginBottom()
	       + this._getPaddingTop() 
	       + this._getPaddingBottom());
	    },
		/**
	     * 获取边左线.
	     * @param el 元素
	     * @return 返回宽度
	     */
	    _getBorderLeft:function(el) {
	    	var el = el || this.thisWindow;
	    	return this._domValue(el.style.borderLeftWidth, 0);;
	    },
	    /**
	     * 获取右边线
	     * @param el 元素
	     * @return 返回宽度
	     */
	    _getBorderRight:function(el) {
	    	var el = el || this.thisWindow;
	    	return this._domValue(el.style.borderRightWidth, 0);
	    },
		/**
		 * 获取上边线
		 * @param el 元素
		 * @return 返回宽度
		 */
	    _getBorderTop:function(el) {
	    	var el = el || this.thisWindow;
	    	return this._domValue(el.style.borderTopWidth, 0);
	    },
	    /**
	     * 获取下边线
	     * @param el 元素
		 * @return 返回宽度
	     */
	    _getBorderBottom:function(el) {
	    	var el = el || this.thisWindow;
	    	return this._domValue(el.style.borderBottomWidth, 0);
	    },
	    /**
	     * 获取左外边距
	     * @param el 元素
		 * @return 返回宽度
	     */
	    _getMarginLeft:function(el) {
	    	var el = el || this.thisWindow;	 
            return this._domValue(el.style.marginLeft, 0);
	    },
	    /**
	     * 获取右外边距
	     * @param el 元素
		 * @return 返回宽度
	     */
	    _getMarginRight:function(el) {
	    	var el = el || this.thisWindow;
            return this._domValue(el.style.marginRight, 0);
	    },
	    /**
	     * 获取上外边距
	     * @param el 元素
		 * @return 返回宽度
	     */
	    _getMarginTop:function(el) {
	    	var el = el || this.thisWindow;
            return this._domValue(el.style.marginTop, 0);
	    },
	    /**
	     * 获取下外边距
	     * @param el 元素
		 * @return 返回宽度
	     */
	    _getMarginBottom:function(el) {
	    	var el = el || this.thisWindow;
            return this._domValue(el.style.marginBottom, 0);
	    },
	    /**
	     * 获取左内边距.
	     * @param el 元素
		 * @return 返回宽度
	     */
	    _getPaddingLeft:function(el) {
	    	var el = el || this.thisWindow;
            return this._domValue(el.style.paddingLeft, 0);
	    },
	    /**
	     * 获取右内边距.
	     * @param el 元素
		 * @return 返回宽度
	     */
	    _getPaddingRight:function(el) {
	    	var el = el || this.thisWindow;
            return this._domValue(el.style.paddingRight, 0);
	    },
	    /**
	     * 获取上内边距.
	     * @param el 元素
		 * @return 返回宽度
	     */
	    _getPaddingTop:function(el) {
	    	var el = el || this.thisWindow;
            return this._domValue(el.style.paddingTop, 0);
	    },
	    /**
	     * 获取下内边距.
	     * @param el 元素
		 * @return 返回宽度
	     */
	    _getPaddingBottom:function(el) {
	    	var el = el || this.thisWindow;
            return this._domValue(el.style.paddingBottom, 0);
	    },
		/**
	     * 获取body元素宽度.
	     * @return body宽度
	     */
	    _getBodyWidth:function() {
	    	if(this.browser.safari) {
	    		return document.documentElement.clientWidth;
	    	} else {
	    		return this.body().width();
	    	}
	    },
	    /**
	     * 获取body元素高度.
	     * @return body高度
	     */
	    _getBodyHeight:function() {
	    	if(this.browser.safari) {
	    		return document.documentElement.clientHeight;
	    	} else {
	    		return this.body().height();
	    	}
	    },
		/**
		 * 返回当前窗口.
		 */
	    getRectDom:function() {
	    	return this.thisWindow;
	    },
		/**
		 * 返回窗口body.
		 */
	    body:function(){
	    	if(typeof this.winBody == "undefined") {
	    		this.winBody = document.getElementsByTagName("body")[0];
	    	}
	    	return this.winBody;
	    },
	    /**
	     * 获取高度.
	     * @return 返回高度
	     */
	    getHeight:function() {
	    	return this.option.height;
	    },	
	    /**
	     * 设置高度.
	     * @param height 高度
	     * @param doRs 执行变更函数
	     */
	    setHeight:function(height, doRs) {
	    	this.option.height = height;
	    	//this.logInfo("Window.setHeight");
	    	doRs = doRs || true;
	    	if(doRs && this._hasResize()) {
	    	    this._doResize();
	    	}
	    },
	    /**
	     * 获取宽度
	     * @return 返回宽度
	     */
	    getWidth:function() {
	    	return this.option.width;
	    },	  
	    /**
	     * 设置宽度.
	     * @param width 宽度
	     * @param doRs 执行变更函数
	     */
	    setWidth:function(width, doRs){
	    	this.option.width = width;
	    	//this.logInfo("Window.setWidth");
	    	doRs = doRs || true;
	    	if(doRs && this._hasResize()) {
	    	    this._doResize();
	    	}
	    },
	    /**
	     * 设置顶点.
	     * @param top 顶点
	     * @param doRs 执行变更函数
	     */
	    setTop:function(top, doRs) {
	    	this.option.top = top;
	    	this.logInfo("Window.setTop");
	    	doRs = doRs || true;
	    	if(doRs && this._hasResize()) {
	    	    this._doResize();
	    	}
	    },
	    /**
	     * 获取当前顶点位置
	     * @return 顶点坐标
	     */
	    getTop:function() {
	    	return this.option.top;
	    },
	    /**
	     * 设置左边位置.
	     * @param left 左边位置
	     * @param doRs 执行变更函数
	     */
	    setLeft:function(left, doRs) {
	    	this.option.left = left;
	    	this.logInfo("Window.setLeft");
	    	doRs = doRs || true;
	    	if(doRs && this._hasResize()) {
	    	    this._doResize();
	    	}
	    },
	    /**
	     * 获取左边位置值.
	     * @return 返回
	     */
	    getLeft:function() {
	    	return this.option.left;
	    }
    });
})();

有了上面的类，我们便可以在test.html文件中添加我们的自定义控件，如下<div>便是我们新增加的dom元素，这里我们把id设置为test, code为com.ui.window类，option中称添加height,width属性 

<!DOCTYPE html>
  <head><title>test</title>
    <script src="../script/common/init.js" type="text/javascript"></script>
  </head>  
  <body>
    <div id='test1' code='com.ui.window' option='{"height":"100","width":"100"}'></div>
  </body>
</html>

同时，我们在样式文件com.comStyle.css中，添加一个样式，如下
注意，如果option没有设置对应的height,width的时候，将会以样式的宽高为准 

.winStyle {
    border:1px solid #C3D2E6;
    font-size:12px;
    width:10px;
    height:10px;
}

这样，我们就可以通过浏览器打开test.html文件查看效果，会发现一个100px的蓝边正方形，

可下载附件的代码
iteye_20428
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
js小控件开发
Jackie Wu
03-05 1167
在Github上看到一个js的插件，于是兴起自己也来尝试坐下...于是参考GIthub上的一个项目自己也做个简单的实验。 可以先参考别人项目的组织及结构来开发代码Github上看到的js插件的代码格式一般是这样的：(function(){ var MyApp = {}; //模块名 /* * 模块其他成员 */ //如 var Component = {} ;
javascript控件可见
buynider的专栏
08-20 1652
        用JavaScript隐藏控件的方法有两种，分别是通过设置控件的style的“display”和“visibility”属性。当style.display="block"或style.visibility="visible"时控件或见，当style.display="none"或style.visibility="hidden"时控件不可见。不同的是“dis
javascript组件开发方式
bingqingsuimeng的专栏
03-19 2万+
作为一名前端工程师，写组件的能力至关重要。虽然javascript经常被人嘲笑是个小玩具，但是在一代代大牛的前仆后继的努力下，渐渐的也摸索了一套组件的编写方式。 下面我们来谈谈，在现有的知识体系下，如何很好的写组件。 比如我们要实现这样一个组件，就是一个输入框里面字数的计数。这个应该是个很简单的需求。 我们来看看，下面的各种写法。 为了更清楚的演示，下面全部使用jQ
一个关于原生 js 开发一款插件的前端教程
weixin_30655219的博客
10-07 90
教程链接：http://www.codeasily.net/course/plugin_course/ 写的不是很好，前面比较松后面比较急，请大家见谅，本人也没多少年前端经验，拿以前写过的教程网站，加上自己有个开源项目，可以拿出来讲一讲。也算是圆了一直以来想写关于原生 js 开发的教程的小目标
JavaScript插件化开发教程 （二）
orichisonic的专栏
01-11 417
1），如果项目技术选型换了这些插件又是强依赖“jQuery”机制，我们以前写的插件将会不能用（假设不用jQuery的情况），如何做重构那？ （2），重构插件的关键逻辑，我们将如何组织那？ 好了，带着问题去学习今天的文章吧。 首先我不是否定“jQuery插件的方式”，其次是我们要从不同的角度分析问题，比如说“jQuery插件有如下优点”： （1），把全部代码放在闭包(一个即时
javascript控件开发之可见控件 1
04-18
在JavaScript控件开发中，"可见控件"是构建用户界面UI的重要组成部分。这些控件是用户与应用程序交互的桥梁，比如按钮、文本框、下拉列表等。本篇文章将聚焦于可见控件的渲染基类，这是创建自定义、高级控件的基础。...
javascript控件开发之可见控件(2)
04-19
在“javascript控件开发之可见控件(2)”这个主题中，我们将深入探讨如何在JavaScript中构建可控制其可见性的控件，并且在上一篇的基础上，通过添加事件相关函数来增强控件的灵活性和可扩展性。 首先，我们需要理解...
javascript控件开发之动态加载
04-07
JavaScript控件开发是一种常见的Web应用开发技术，它允许开发者创建交互性强、功能丰富的用户界面元素。动态加载作为JavaScript控件开发中的一个重要概念，是提升网页性能和用户体验的关键手段。动态加载意味着控件...
javascript控件开发之继承关系
04-08
在这个主题中，“javascript控件开发之继承关系”主要探讨的是如何利用JavaScript的面向对象特性来构建和组织控件的层次结构，以及如何通过继承来实现代码的复用和模块化。 在JavaScript中，继承是基于原型...
javascript控件开发之布局控件
05-14
JavaScript控件开发是Web开发中的重要一环，特别是在构建交互丰富的网页应用时。布局控件是其中的关键元素，它允许开发者有效地组织和管理页面上的元素，实现多控件的协调和共存。在这个主题中，我们将深入探讨...
一篇文章教你开发一个完整的JavaScript组件
weixin_34007886的博客
05-16 374
作为一名开发者，大家应该都知道在浏览器中存在一些内置的控件：Alert，Confirm等，但是这些控件通常根据浏览器产商的不同而形态各异，视觉效果往往达不到UI设计师的要求。更重要的是，这类内置控件的风格很难与形形色色的各种风格迥异的互联网产品的设计风格统一。因此，优秀的前端开发者们各自开发自己的个性化控件来替代浏览器内置的这些控件。当然，这类组件在网络上已经有不计其数相当优秀的，写这篇文章的目的...
JavaScript的表单、控件
爱蹦跶的全栈大A阿
02-06 1118
表单是 web 开发中不可或缺的一部分，用于收集用户输入。本文将深入探讨 HTML 表单元素，涵盖常见元素、属性、事件和验证等主题，并提供大量代码示例，帮助你构建更强大的表单。​表单元素是 HTML 中非常重要的元素，可以用于收集用户输入。本文介绍了常见的表单元素、表单元素属性、表单事件和表单验证。表单元素是 web 开发的基础，掌握它们对于创建各种类型的表单至关重要。本文提供的知识和示例可以帮助你快速上手，并提升表单开发技能。希望本文对你有所帮助！
开发JavaScript组件（完整示例）
09-30 1000
使用JavaScript，按照面向对象的思想来构建组件。 现以构建一个TAB组件为例。 从功能上讲，组件包括可视部分和逻辑控制部分；从代码结构上讲，组件包括代码部分和资源部分（样式、图片等）。 组件的特点：高内聚，低耦合（不与其他代码逻辑交叉，可以继承，包含）；封装性（隐藏私有方法和变量）；可重用性（可反复多次使用，用来组装更复杂的应用）。 <html> <head> <meta http-equiv="Content-Type" content="text/html.
如何开发一个原生 js 插件
最新发布
不同场景下的水平居中
05-15 112
原生JS插件编写
3 JavaScript基础使用
Zinksl的博客
10-28 479
文章目录 前言 读前思考！ 1 编写JavaScript的三类位置 1.1 写在HTML页面内的JavaScript 1.2 写在某个控件里的JavaScript 1.3 单独文本里的JavaScript 2 JavaScript怎么写呢 2.1 在知道如何写代码之前需要明白几个点： （1）写js注意事项 （2）什么是字面量、变量和标识符 （3）JavaScript的六类数据类型 🚩强制类型转换：
JS图表控件LightningCharts JS使用教程：创建一个带有 2D 和 3D 频谱图的 JS 仪表板
需要项目管理工具、数据库管理工具、JAVA开发工具等下载和试用资源的朋友，记得私信我~
05-19 1130
在本文中，我们将创建一个带有 2D 和 3D 频谱图的 JS 仪表板。
js插件开发的几个简要步骤
aphy358的博客
11-11 4667
JS插件的开发步骤： 一、首先需要闭包，如：     (function(){         //TO DO     })(jQuery);     这种规范的作用是：         1、避免全局依赖；         2、避免第三方破坏；         3、兼容jQuery操作符'$'h和'jQuery'。 二、给插件加入主体
Auto.JS 教程（1）
热门推荐
QiHsMing的博客
02-12 12万+
Auto.JS Auto.js 是个基于 JavaScript 语言运行在Android平台上的脚本框架。Auto.js主要工作原理是基于辅助服务AccessibilityService。 功能介绍： 数据监控：可以监视当前手机的数据。 图片监控：截图获取当前页面信息。 控件操作：模拟操作手机控件。 自动化工作流：编写简单的脚本，完成一系列自动化操作。如：微信/QQ自动点赞，快速抢单等。 定时功...
浏览器插件之C++开发ActiveX
u012125696的专栏
11-07 8753
转自： 网上看到些文章讲述关于C++创建ActiveX插件的讲述，觉得比较好，特保存起来    一般的Web应用对于浏览器插件能不使用的建议尽量不使用，因为其涉及到安全问题以及影响用户安装（或自动下载注册安装）体验问题。在有特殊需求（如涉及数据安全的金融业务数据交互、需插件才能实现的与本地设备的交互等）的情况下可以酌情慎用。      浏览器插件总体可以划分为两大阵营
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值