• / 9
  • 下载费用:10 金币  

【蓝桥软件学院】数字和时间微调.docx

关 键 词:
【蓝桥软件学院】数字和时间微调.docx
资源描述:
http://xueyuan.lanqiao.org数字和时间微调课程目标 了解 NumberSpinner 和 TimeSpinner 的基本属性、方法和事件SpinnerSpinner 简介微调控件结合了一个可编辑文本框和 2 个小按钮让用户选择一个值的范围。和下拉列表框类似,微调控件允许用户输入值,但是没有下拉列表。微调控件是创建其他高级微调控件的基础控件,比如:numberspinner, timespinner 等。Spinner 并不是学习的重点,只是为后续的 NumberSpinner、TimeSpinner 及 DateTimeSpinner 打基础。大家简单了解即可。效果如下图:开发 Spinner 程序复制1. 参考代码:27/spinner01.html效果如上图。Spinner 常用属性属性名 属性值类型 描述 默认值width number 组件的宽度。 autohttp://xueyuan.lanqiao.orgheight number 组件的高度。 22value string 默认值。min number 允许的最小值。max number 允许的最大值。increment number 在点击微调按钮的时候的增量值。 1editable boolean 定义用户是否可以直接输入值到字段。 truedisabled boolean 定义是否禁用字段。 falsereadonly boolean 定义控件是否为只读。 falsespinAlign string 定义控件的对齐方式。可用值:'left','right','horizontal','vertical'rightspin function(down) 在用户点击微调按钮的时候调用的函数。'down'参数对应用户点击的向下按钮。Spinner 常用方法方法名 方法参数 描述options none 返回属性对象。destroy none 销毁微调组件。resize width 返回组件宽度。通过'width'参数重写原始宽度。http://xueyuan.lanqiao.orgenable none 启用组件。disable none 禁用组件。getValue none 获取组件值。setValue value 设置组件值。readonly mode 启用/禁用只读模式。clear none 清空组件值。reset none 重置组件值。Spinner 常用事件事件名 事件参数 描述onSpinUp none 在用户点击向上微调按钮的时候触发。onSpinDown none 在用户点击向下微调按钮的时候触发。NumberSpinnerNumberSpinner 简介数字微调控件的创建是基于微调控件和数值输入框控件的,允许用户使用上/下微调按钮调整到用户的期望值。效果如下图:开发 NumberSpinner 程序http://xueyuan.lanqiao.org复制1. 参考代码:27/numberspinner01.html该数值输入框不允许输入,只能通过上/下微调按钮调整数值。效果如下图:NumberSpinner 常用属性本组件的属性完整继承自 spinner(微调)和 numberbox(数值输入框)。NumberSpinner 常用方法本组件的方法完整扩展自 spinner(微调)。NumberSpinner 常用事件本组件的事件完整继承自 spinner(微调)。案例一:复制1. 价格: 2.3. $(“#input1“).numberspinner({4. min:0,5. max:100000000,6. precision:1,7. value:0,8. groupSeparator:',',9. prefix:'$',10. prompt: '请输入数值',11. //带有清除图标12. icons:[{13. iconCls:'icon-clear',14. handler: function(e){http://xueyuan.lanqiao.org15. $(e.data.target).numberspinner('clear');16. }17. }]18.});19.20.禁用字段21.启用字段22.设置值 23.获取值 24.清除值 25.重置值 26.27. function set(){28. $.messager.prompt('提示信息', '请输入要设置的数值:', function(value){29. if (value){30. $('#input1').numberspinner('setValue',value);31. }32. });33. }34.参考代码:27/nu
展开阅读全文
  微传网所有资源均是用户自行上传分享,仅供网友学习交流,未经上传用户书面授权,请勿作他用。
0条评论

还可以输入200字符

暂无评论,赶快抢占沙发吧。

关于本文
本文标题:【蓝桥软件学院】数字和时间微调.docx
链接地址:https://www.weizhuannet.com/p-9142958.html
微传网是一个办公文档、学习资料下载的在线文档分享平台!

微传网博客

网站资源均来自网络,如有侵权,请联系客服删除!

 网站客服QQ:80879498  会员QQ群:727456886

copyright@ 2018-2028 微传网络工作室版权所有

     经营许可证编号:冀ICP备18006529号-1 ,公安局备案号:13028102000124

收起
展开