场景

效果

用法

从标记创建数字框（numberbox）。

<input type="text" class="easyui-numberbox" value="100" data-options="min:0,precision:2">

使用 javascript 创建数字框（numberbox）。

<input type="text" id="nn">$('#nn').numberbox({min:0,precision:2});

属性

该属性扩展自验证框（validatebox），下面是为数字框（numberbox）添加的属性。

名称	类型	描述	默认值
disabled	boolean	定义是否禁用该字段。	false
value	number	默认值。
min	number	允许的最小值。	null
max	number	允许的最大值。	null
precision	number	显示在小数点后面的最大精度。	0
decimalSeparator	string	分隔数字的整数部分和小数部分的分隔字符。	.
groupSeparator	string	分隔整数组合的字符。
prefix	string	前缀字符串。
suffix	string	后缀字符串。
filter	function(e)	定义如何过滤被按下的键，返回 true 则接受输入字符。该属性自版本 1.3.3 起可用。
formatter	function(value)	用来格式数字框（numberbox）值的函数。返回显示在框中的字符串值。
parser	function(s)	用来解析字符串的函数。返回数字框（numberbox）值。

事件

名称	参数	描述
onChange	newValue,oldValue	当字段值改变时触发。

方法

该方法扩展自验证框（validatebox），下面是为数字框（numberbox）添加或重写的方法。

名称	参数	描述
options	none	返回选项（options）对象。
destroy	none	销毁数字框（numberbox）对象。
disable	none	禁用该域。
enable	none	启用该域。
fix	none	把值固定为有效的值。
setValue	none	设置数字框（numberbox）的值。代码实例： $('#nn').numberbox('setValue', 206.12);
getValue	none	获取数字框（numberbox）的值。代码实例： var v = $('#nn').numberbox('getValue'); alert(v);
clear	none	清除数字框（numberbox）的值。
reset	none	重置数字框（numberbox）的值。该方法自版本 1.3.2 起可用。

实现

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title><link rel="stylesheet" type="text/css" href="/easyui/themes/icon.css"><link rel="stylesheet" type="text/css" href="/easyui/themes/default/easyui.css"><script type="text/javascript" src="/easyui/jquery.min.js"></script><script type="text/javascript" src="/easyui/jquery.easyui.min.js"></script>
</head>
<body>
<input type="text" class="easyui-numberbox" value="100" data-options="min:0,precision:2">
</body>
</html>

EasyUI中Numberbox的简单使用相关推荐

EasyUI中分页的简单使用
场景效果属性名称类型描述默认值 total number 记录总数,应该在创建分页(pagination)时设置. 1 pageSize number 页面尺寸.(注:每页显示的最大记录数 ...
【EasyUI】关于EasyUI中numberbox onblur事件失效的问题
easyui-numberbox 与 easyui-validatebox 参考以下: easyui-numberbox不像easyui-validatebox那样能绑定blur事件,最简单的解决方法 ...
第二百一十三节，jQuery EasyUI，NumberBox(数值输入框)组件
jQuery EasyUI,NumberBox(数值输入框)组件功能:只能输入数值,和各种数值的计算学习要点: 1.加载方式 2.属性列表 3.事件列表 4.方法列表本节课重点了解 EasyUI ...
datagrid vue_类似 easyui 中 datagrid 使用习惯的 element-ui 数据表格组件（el-datagrid）...
背景 element-ui 中的 el-table 组件只提供了数据展示,而分页功能作为一个单独的组件 el-pagination,并没有像 Ant Design 一样集成到 el-able 组件中, ...
php 可以编辑treegrid,浅谈EasyUI中编辑treegrid的方法
主从表,从表是一个treegrid,加载完数据后,点击节点进入编辑状态. 复制代码代码如下: columns : [ [ { title : "ID", field : &quo ...
php 可以编辑treegrid,浅谈EasyUI中编辑treegrid的方法_jquery
主从表,从表是一个treegrid,加载完数据后,点击节点进入编辑状态. columns : [ [ { title : "ID", field : "id", ...
django中使用celery简单介绍
链客,专为开发者而生,有问必答! 此文章来自区块链技术社区,未经允许拒绝转载. 本章节我们重点在于实现,如何存储任务的结果. 我们将任务函数改为: from celery_demo.celery im ...
python tkinter库、添加gui界面_使用Python中tkinter库简单gui界面制作及打包成exe的操作方法（二）...
使用Python中tkinter库简单gui界面制作及打包成exe的操作方法(二),创建一个,界面,布局,文件,路径使用Python中tkinter库简单gui界面制作及打包成exe的操作方法(二) ...
ajax与easyui树节点,EasyUI中的tree用法介绍
真的是太忙了,本应该有好多东西可以写,但是没什么闲时间,每次想到写的时候,来点事就又给忘了.10月最后一天了,在忙也得把这篇文章写完,不然又得多一个空白月了. 这是之前带领成员开发一个小模块功能的时候 ...

EasyUI中Numberbox的简单使用

场景

效果

用法

属性

事件

方法

实现

EasyUI中Numberbox的简单使用相关推荐

最新文章

热门文章