mui提供了数字输入框控件,可直接输入数字,也可以点击“+”、“-”按钮变换当前数值;默认numbox控件dom结构比较简单,如下:
~~~
<div class="mui-numbox">
<!-- "-"按钮,点击可减小当前数值 -->
<button class="mui-btn mui-numbox-btn-minus" type="button">-</button>
<input class="mui-numbox-input" type="number" />
<!-- "+"按钮,点击可增大当前数值 -->
<button class="mui-btn mui-numbox-btn-plus" type="button">+</button>
</div>
~~~
可通过data-*自定义属性设置数字输入框的参数,如下:
![](https://box.kancloud.cn/2016-07-18_578ce87d2f813.png)
示例:设置取值范围为0~100,每次变化步长为10,则代码如下
~~~
<div class="mui-numbox" data-numbox-step='10' data-numbox-min='0' data-numbox-max='100'>
<button class="mui-btn mui-numbox-btn-minus" type="button">-</button>
<input class="mui-numbox-input" type="number" />
<button class="mui-btn mui-numbox-btn-plus" type="button">+</button>
</div>
~~~
- mui
- 拓展
- 本地存储
- 获取时间
- 滚动帧听
- ui组件
- accordion(折叠面板)
- actionsheet(操作表)
- badge(数字角标)
- button(按钮)
- cardview(卡片视图)
- checkbox(复选框)
- dialog(对话框)
- 图片轮播
- 输入增强
- list(列表)
- 遮罩蒙版
- media list(图文列表)
- numbox(数字输入框)
- 侧滑导航
- 弹出菜单
- picker(选择器)
- popPicker
- dtpicker
- progressbar(滚动条)
- radio(单选框)
- range(滑块)
- scroll(区域滚动)
- slide(轮播组件)
- switch(开关)
- 手机底层
- 蜂鸣提示音和手机震动
- 设备信息
- 手机信息
- 电话
- 发送短信
- 消息框
- 浏览器打开网页
- 界面
- 手势
- 轮播组件
- 底部导航
- 打开新页面
- 遮罩
- webview详解
- js基础
- 数组
- mui教程
- 教程— html5+ webview 底部栏用法详解(二)(转载)
- 自动弹出虚拟键盘
- Native.js示例汇总