Extjs NumberField后面加单位实现思路


Posted in Javascript onJuly 30, 2013

UnitText.js
=======================

// 输入框textfield后面放字unitText定义: 
Ext.override(Ext.form.TextField, { 
unitText : '', 
onRender : function(ct, position) { 
Ext.form.TextField.superclass.onRender.call(this,ct, position); if (this.unitText != ''){ 
this.unitEl =ct.createChild({ 
tag: 'div', 
html: this.unitText this.unitEl.addClass('x-form-unit'); this.width =this.width 
-(this.unitText.replace(/[^\x00-\xff]/g, "xx").length * 6 +2); this.alignErrorIcon= function() { 
this.errorIcon.alignTo(this.unitEl,'tl-tr', [2, 0]); }});

将UnitText.js放入到jsp文件中,加上css样式,如下:
<style> 
.x-form-unit{ 
height:22px; 
line-height:22px; 
padding-left:2px; 
display:inline-block; 
display:inline; </style> 
<script type="text/javascript"src="UnitText.js"></script>

这样就可以用了,使用方法如下:
var jine = new Ext.form.NumberField({ 
id: 'je', 
fieldLabel: '金额', 
allowDecimals: true, // 允许小数点? 
allowNegative: false, // 允许负数? 
width: 100, 
style: 'text-align:right', 
unitText: ' 元' 
});
Javascript 相关文章推荐
获取HTML DOM节点元素的方法的总结
Aug 21 Javascript
关于Ext中form移除textfield方法:hide(),setVisible(false),remove()
Dec 02 Javascript
js实现简单秒表走动的时钟特效
Mar 25 Javascript
Javascript的表单与验证-非空验证
Mar 18 Javascript
js通过指定下标或指定元素进行删除数组的实例
Jan 12 Javascript
js仿小米手机上下滑动效果
Feb 05 Javascript
原生JS中slice()方法和splice()区别
Mar 06 Javascript
Js实现中国公民身份证号码有效性验证实例代码
May 03 Javascript
详解.vue文件中监听input输入事件(oninput)
Sep 19 Javascript
Javascript刷新页面的实例
Sep 23 Javascript
在 Typescript 中使用可被复用的 Vue Mixin功能
Apr 17 Javascript
浅谈angular2子组件的事件传递(任意组件事件传递)
Sep 30 Javascript
Js中获取frames中的元素示例代码
Jul 30 #Javascript
js中的屏蔽的使用示例
Jul 30 #Javascript
使用js正则控制input标签只允许输入的值
Jul 29 #Javascript
js为鼠标添加右击事件防止默认的右击菜单弹出
Jul 29 #Javascript
js保留两位小数使用toFixed实现
Jul 29 #Javascript
jquery图片不完全按比例自动缩小的简单代码
Jul 29 #Javascript
jquery验证手机号码、邮箱格式是否正确示例代码
Jul 28 #Javascript
You might like
php flush类输出缓冲剖析
2008/10/19 PHP
PHP仿博客园 个人博客(1) 数据库与界面设计
2013/07/05 PHP
php微信公众号开发之秒杀
2018/10/20 PHP
让人期待的2011年度最佳 jQuery 插件分享
2012/03/16 Javascript
js中生成map对象的方法
2014/01/09 Javascript
JQuery实现Ajax加载图片的方法
2015/12/24 Javascript
第十章之巨幕页头缩略图与警告框组件
2016/04/25 Javascript
利用Node.js+Koa框架实现前后端交互的方法
2017/02/27 Javascript
js实现图片加载淡入淡出效果
2017/04/07 Javascript
微信小程序实现默认第一个选中变色效果
2018/07/17 Javascript
解决前后端分离 vue+springboot 跨域 session+cookie失效问题
2019/05/13 Javascript
对vuex中getters计算过滤操作详解
2019/11/06 Javascript
用Angular实现一个扫雷的游戏示例
2020/05/15 Javascript
逐行分析鸿蒙系统的 JavaScript 框架(推荐)
2020/09/17 Javascript
python 实现上传图片并预览的3种方法(推荐)
2017/07/14 Python
python删除字符串中指定字符的方法
2018/08/13 Python
Python3爬虫学习之爬虫利器Beautiful Soup用法分析
2018/12/12 Python
django数据库自动重连的方法实例
2019/07/21 Python
Python CVXOPT模块安装及使用解析
2019/08/01 Python
Python操作Mongodb数据库的方法小结
2019/09/10 Python
Pytorch 中retain_graph的用法详解
2020/01/07 Python
python+tifffile之tiff文件读写方式
2020/01/13 Python
Python如何执行系统命令
2020/09/23 Python
pycharm 配置svn的图文教程(手把手教你)
2021/01/15 Python
python实现MySQL指定表增量同步数据到clickhouse的脚本
2021/02/26 Python
JBL英国官网:JBL UK
2018/07/04 全球购物
阳光体育:Sunny Sports(购买露营和远足设备)
2018/08/07 全球购物
线程的基本概念、线程的基本状态以及状态之间的关系
2012/10/26 面试题
法律专业个人实习自我鉴定
2013/09/23 职场文书
一年级学生评语
2014/04/23 职场文书
小学教师节活动总结
2015/03/20 职场文书
2015年控辍保学工作总结
2015/05/18 职场文书
Python爬取科目四考试题库的方法实现
2021/03/30 Python
Windows下使用Nginx+Tomcat做负载均衡的完整步骤
2021/03/31 Servers
十大最强岩石系宝可梦,怪颚龙实力最强,第七破坏力很强
2022/03/18 日漫
Python的代理类实现,控制访问和修改属性的权限你都了解吗
2022/03/21 Python