jQuery EasyUI 入门(30)

tyh_Fantasy

NumberSpinner（数字微调）

扩展自$.fn.spinner.defaults和$.fn.numberbox.defaults。使用$.fn.numberspinner.defaults重写默认值对象。

数字微调控件的创建是基于微调控件和数值输入框控件的。他可以转换输入的值，比如：数值、百分比、货币等。它也允许使用上/下微调按钮调整到用户的期望值。

[img]file:///C:/Users/tyh/AppData/Local/Temp/CyberArticle/45a5ca0792f87f59d409da51b06e4095_files/numberspinner[1].png[/img]

依赖关系

• spinner
• numberbox
  

使用案例

使用标签创建数字微调组件。

• <input id="ss" class="easyui-numberspinner" style="width:80px;"
•         required="required" data-options="min:10,max:100,editable:false">
  

        <input id="ss" class="easyui-numberspinner" style="width:80px;"                        required="required" data-options="min:10,max:100,editable:false">

使用Javascript创建数字微调组件。

• <input id="ss" required="required" style="width:80px;">
  

        <input id="ss" required="required" style="width:80px;">

• $('#ss').numberspinner({
•     min: 10,
•     max: 100,
•     editable: false
• });
  

        $('#ss').numberspinner({                min: 10,                max: 100,                editable: false        });

创建数字微调组件并将数值格式化为货币字符串。

• <input class="easyui-numberspinner" value="1234567890" style="width:150px;"
•         data-options="required:true,precision:2,groupSeparator:',',decimalSeparator:'.',prefix:'$'" />
  

        <input class="easyui-numberspinner" value="1234567890" style="width:150px;"                        data-options="required:true,precision:2,groupSeparator:',',decimalSeparator:'.',prefix:'$'" />

属性

本组件的属性完整继承自spinner(微调)和numberbox(数值输入框)。

事件

本组件的事件完整继承自spinner(微调)。

方法

本组件的方法扩展自spinner(微调)，本组建新增的方法如下：

方法名称	方法参数	描述
options	none	返回属性对象。
setValue	value	设置数字微调控件的值。 代码示例： $('#ss').numberspinner('setValue', 8234725);  // 设置值var v = $('#ss').numberspinner('getValue');      // 获取值alert(v);

ldl