本节课重点了解 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. iOS 网络与多线程--2.同步Get方式的网络请求(阻塞)

    通过Get请求方式同步获取网络数据.一旦发送同步请求,程序将停止用户交互,直至服务器返回数据. 之后在视图控制器文件(ViewController.m)内添加以下代码 在viewDidLoad函数内添 ...

  2. 真机测试,Xcode报错:process launch failed: Security

    解决办法:手机->通用->设备管理->信任开发商应用即可

  3. C# 导出word文档及批量导出word文档(3)

    在初始化WordHelper时,要获取模板的相对路径.获取文档的相对路径多个地方要用到,比如批量导出时要先保存文件到指定路径下,再压缩打包下载,所以专门写了个关于获取文档的相对路径的类. #regio ...

  4. 武汉科技大学ACM:1005: 单位转换

    Problem Description BobLee最近在复习考研,在复习计算 机组成原理的时候,遇到了一个问题.就是在计算机存储里面的单位转换.我们都知道1MB=1024KB,1KB=1024B,1 ...

  5. Java中实现线程的方法

    Java中有几种方法可以实现一个线程?用什么关键字修饰同步方法?stop()和suspend()方法为何不推荐使用? 第一种:继承Thread类 new Thread(){}.start();这表示调 ...

  6. spark 环境变量系列配置

    1. hadoop core-site.xml配置

  7. HAPROXY 配置项/配置实例

    HAPROXY 配置项/实例 常用配置选项: OPTION 选项: option httpclose :HAProxy会针对客户端的第一条请求的返回添加cookie并返回给客户端,客户端发送后续请求时 ...

  8. Today's interview of C#

    I think they are advanced topics. C# 1. when will you use list, when will you use hashtable. 2. when ...

  9. 自定义cell 自适应高度

    #pragma mark - 动态计算cell高度 //计算 返回 文本高度 + (CGFloat)calsLabelHeightWithContact:(Contacts *)contact { / ...

  10. 如何在AD6(altium designer 6.x)中设置PCB大小

    做一块板子,体积比较的大(长度有20CM),而AD默认的长度只有15cm,满足不了本人要求.在网上找到了解决方法: 先在Mechanical(机械层,如Mechanical1)下绘制一个板框,也就是你 ...