NumberBox( 数值输入框) 组件
本节课重点了解 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( 数值输入框) 组件的更多相关文章
- 第二百一十三节,jQuery EasyUI,NumberBox(数值输入框)组件
jQuery EasyUI,NumberBox(数值输入框)组件 功能:只能输入数值,和各种数值的计算 学习要点: 1.加载方式 2.属性列表 3.事件列表 4.方法列表 本节课重点了解 EasyUI ...
- easyui源码翻译1.32--NumberBox(数值输入框)
前言 扩展自$.fn.validatebox.defaults.使用$.fn.numberbox.defaults重写默认值对象.下载该插件翻译源码 数值输入框是用来限制用户只能输入数值型数据的.他可 ...
- [Input-number]数字输入框组件
需求 加.减按钮 初始值 最大.最小值 数值改变时,触发一个自定义事件来通知父组件 目录文件 index.html 入口页 input-number.js 数字输入框组件 index.js 根实例 实 ...
- DateBox( 日期输入框) 组件
本节课重点了解 EasyUI 中 DateBox(日期输入框)组件的使用方法,这个组件依赖于 Combo(自定义下拉框)和 Calendar(日历). 一. 加载方式//class 加载方式<i ...
- 【input】输入框组件说明
input输入框组件 原型: <input value="[String]" type="[text | number | idcard | digit]" ...
- 基于Vue的数字输入框组件开发
1.概述 Vue组件开发的API:props.events和slots 2.组件代码 github地址:https://github.com/MengFangui/VueInputNumber 效果: ...
- 第二百一十九节,jQuery EasyUI,DateTimeBox(日期时间输入框)组件
jQuery EasyUI,DateTimeBox(日期时间输入框)组件 学习要点: 1.加载方式 2.属性列表 3.方法列表 本节课重点了解 EasyUI 中 DateTimeBox(日期时间输入框 ...
- 第二百一十五节,jQuery EasyUI,DateBox(日期输入框)组件
jQuery EasyUI,DateBox(日期输入框)组件 学习要点: 1.加载方式 2.属性列表 3.事件列表 4.方法列表 本节课重点了解 EasyUI 中 DateBox(日期输入框)组件的使 ...
- flutter 自定义输入框组件
一.组件分析 ui如下 根据UI分析我们需要提取哪些是动态的,可以通过传递参数得到不同的结果? 1.左侧icon 2.输入的文本 3.是否是密码框 4.输入框的控制器:如何时时得到输入框的值 二.快速 ...
随机推荐
- expected function body after function declarator
我出现这个错误是在pch中添加了一个a.h文件 然后在其他文件的b.h文件中就出现这个错误.. 后来排查出原因是: 在pch中, 这个a.h文件在b.h文件之后, 所以在b.h中使用的时候就会报错
- php curl操作
<?php // $curl=curl_init(); // $url="http://localhost/cc/get.php?lo=ccc"; // curl_setop ...
- java数据库连接类,已经把数据库操作的方法都封装好了
在这里分享一个已经封装好了的java数据库连接类,只要创建对象就可以实现数据库的增删改查操作,用过都说好.其实这个不是我自己写的,是一个理解和学习能力超高的朋友写的,他也很乐于分享交流,本人也深受他的 ...
- mysql 5.5 升级到 mysql 5.6
目前MySQL数据库软件升级到5..26版本,主要有两种方法.一种是停机升级,即在现有环境下先停止数据库,然后升级数据库软件版本和数据库版本:另外一种是采用不停机的主从升级(master--slave ...
- kafka教程
一.理论介绍(一)相关资料1.官方资料,非常详细: http://kafka.apache.org/documentation.html#quickstart2.有一篇翻译版,基本一致,有些细节不 ...
- javascript DOM对象转jquery对象
首先,假设一种情形:要在HTML文件中为一个select对象添加一个函数,这个函数的名字叫dynamic_change(this),当select的option被改变的时候调用onchange事件来处 ...
- 记一次 nginx 504 Gateway Time-out
今天程序在执行一项excel导出任务的时候 出现了nginx超时的提示 nginx 504 Gateway Time-out 排查过程: 查看该任务 发现内容是一个数据量20000条信息 每条信息有5 ...
- 移动端app测试
对于手机项目(应用软件),主要是进行系统测试. 而针对手机应用软件的系统测试,我们通常从如下几个角度开展测试工作: 功能模块测试: 交叉事件测试: 性能测试: 安全测试: 容量测试: 兼容性测试: 接 ...
- JS--图片轮播效果
搞了很长时间才弄清楚图片轮播效果的原理,理解各个事件发生的原因,浪费了这么长的时间,只怪自己的知识太过于薄弱.现将代码写下,供大家参看,如有不妥之处还望指出,大家一起学习. 功能: 1.点击左右两边的 ...
- 复杂事件处理引擎—Esper入门(第二弹)
说明: 以下内容,可以参考Esper官方网站<Qucik start & Tutorial >(顺序做了部分调整). PS:因为英语水平有限(大学期间刚过CET4的英语小盲童一枚) ...