本节课重点了解 EasyUI 中 NumberBox(数值输入框)组件的使用方法,这个组件依赖
于 ValidateBox(验证框)组件。
一. 加载方式
//class 加载方式
<input type="text" class="easyui-numberbox" value="100"
data-options="min:0,precision:2">
//JS 加载调用
$('#box').numberbox({
min : 0,
precision : 2,
});

二. 属性列表

//属性设置
$('#box').numberbox({
required : true,
min : 0,
precision : 2,
disabled : false,
value : 123.45,
max : 500,
decimalSeparator : ':',
groupSeparator : ',',
prefix : '$',
suffix : '€',
filter : function (e) {
return true;
},
formatter : function (value) {
return '123' + value;
},
parser : function (s) {
return s + 1;
},
});

四. 方法列表

//返回属性对象
console.log($('#box').numberbox('options'));
//销毁组件
$('#box').numberbox('destroy');
//禁用和启用
$('#box').numberbox('disable');
$('#box').numberbox('enable');
//修正为有效值
$(document).keyup(function () {
$('#box').numberbox('fix');
});
//赋值
$(document).click(function () {
$('#box').numberbox('setValue', 123);
});
//取值
$(document).click(function () {
console.log($('#box').numberbox('getValue'));
});;
//清空
$(document).click(function () {

$('#box').numberbox('clear');
});
//重置
$(document).click(function () {
$('#box').numberbox('reset');
});
PS:我们可以使用$.fn.numberbox.defaults 重写默认值对象。

NumberBox( 数值输入框) 组件的更多相关文章

  1. 第二百一十三节,jQuery EasyUI,NumberBox(数值输入框)组件

    jQuery EasyUI,NumberBox(数值输入框)组件 功能:只能输入数值,和各种数值的计算 学习要点: 1.加载方式 2.属性列表 3.事件列表 4.方法列表 本节课重点了解 EasyUI ...

  2. easyui源码翻译1.32--NumberBox(数值输入框)

    前言 扩展自$.fn.validatebox.defaults.使用$.fn.numberbox.defaults重写默认值对象.下载该插件翻译源码 数值输入框是用来限制用户只能输入数值型数据的.他可 ...

  3. [Input-number]数字输入框组件

    需求 加.减按钮 初始值 最大.最小值 数值改变时,触发一个自定义事件来通知父组件 目录文件 index.html 入口页 input-number.js 数字输入框组件 index.js 根实例 实 ...

  4. DateBox( 日期输入框) 组件

    本节课重点了解 EasyUI 中 DateBox(日期输入框)组件的使用方法,这个组件依赖于 Combo(自定义下拉框)和 Calendar(日历). 一. 加载方式//class 加载方式<i ...

  5. 【input】输入框组件说明

    input输入框组件 原型: <input value="[String]" type="[text | number | idcard | digit]" ...

  6. 基于Vue的数字输入框组件开发

    1.概述 Vue组件开发的API:props.events和slots 2.组件代码 github地址:https://github.com/MengFangui/VueInputNumber 效果: ...

  7. 第二百一十九节,jQuery EasyUI,DateTimeBox(日期时间输入框)组件

    jQuery EasyUI,DateTimeBox(日期时间输入框)组件 学习要点: 1.加载方式 2.属性列表 3.方法列表 本节课重点了解 EasyUI 中 DateTimeBox(日期时间输入框 ...

  8. 第二百一十五节,jQuery EasyUI,DateBox(日期输入框)组件

    jQuery EasyUI,DateBox(日期输入框)组件 学习要点: 1.加载方式 2.属性列表 3.事件列表 4.方法列表 本节课重点了解 EasyUI 中 DateBox(日期输入框)组件的使 ...

  9. flutter 自定义输入框组件

    一.组件分析 ui如下 根据UI分析我们需要提取哪些是动态的,可以通过传递参数得到不同的结果? 1.左侧icon 2.输入的文本 3.是否是密码框 4.输入框的控制器:如何时时得到输入框的值 二.快速 ...

随机推荐

  1. Mysql 视图笔记

    1.       视图的定义 视图就是从一个或多个表中,导出来的表,是一个虚拟存在的表.视图就像一个窗口(数据展示的窗口),通过这个窗口,可以看到系统专门提供的数据(也可以查看到数据表的全部数据),使 ...

  2. Java实现多线程下载

    package cn.test.DownLoad; import java.io.File; import java.io.InputStream; import java.io.RandomAcce ...

  3. HashTable 及应用

    HashTable-散列表/哈希表,是根据关键字(key)而直接访问在内存存储位置的数据结构. 它通过一个关键值的函数将所需的数据映射到表中的位置来访问数据,这个映射函数叫做散列函数,存放记录的数组叫 ...

  4. canvas 绘制矩形

    XXX(x,y,width,height)   x矩形左上角x坐标                                   y矩形左上角y坐标                       ...

  5. 23个phpcms v9模板制作及二次开发常用代码案例

    0:调用最新文章,带所在版块 {pc:get sql="SELECT a.title, a.catid, b.catid, b.catname, a.url as turl ,b.url a ...

  6. Canvas -画图 关键字

    颜色.样式和阴影 属性 描述 fillStyle 设置或返回用于填充绘画的颜色.渐变或模式 strokeStyle 设置或返回用于笔触的颜色.渐变或模式 shadowColor 设置或返回用于阴影的颜 ...

  7. 百度SEO优化

    下面是一些SEO优化的基本步骤: 一.内部优化 (1)TITLE,KEYWORDS,DESCRIPTION等的优化 (2)内部链接的优化,包括相关性链接,锚文本链接,各导航等链接页 (3)每天保持站内 ...

  8. Delphi XE7下 Intraweb 发布为ASP.NET应用程序

    一.XE7下Intraweb开发这里就不说了,重点是在开发Intraweb时与ISAPI不同之处要选择 IW library,编译成DLL文件. 二.网站的配置 1.这是站点的物理路径,c:\site ...

  9. php读取memcache二进制数据

    memcache作为一个数据中间层,经常用来做数据交换. 比如在某个系统内部我们规定如下的用户状态的信息,每个用户只需要存续52个字节. Key state#ID 如”state#10888” Val ...

  10. AndroidStudio1.1.0配置使用androidannotations

    1:从GitHub上下载最新版androidannotations-api-3.3.1.jar 2:新建Module:my-aa-test 3:将androidannotations-api-3.3. ...