编程开源技术交流,分享技术与知识

网站首页 > 开源技术 正文

MUI-日期联动-picker(选择器)(mui日期选择控件)

wxchong 2024-09-25 22:51:57 开源技术 31 ℃ 0 评论
  • 通过new mui.DtPicker() - 初始化DtPicker组件

  • 通过type - 设置日历初始视图模式

  • 通过labels - 设置默认标签区域提示语

  • 通过beginDate和endDate设置开始,结束日期

  • 通过customData -设置时间/日期别名

  • 通过dtPicker.show( SelectedItemsCallback ) - 显示dtPicker

var dtpicker = new mui.DtPicker({ //注意大小写

"type": "time", // 时间格式(时分)

// "type":"datetime"(年月日时分)

// "type":"date"(年月日)

// "type":"hour"(年月日时)

"labels": ['年', 'Mon', 'Day', 'Hour', 'min'],//设置默认标签区域提示语

"beginDate": new Date(2015, 04, 25),//设置开始日期

"endDate": new Date(2016, 04, 25),//设置结束日期

"customData": {

"h": [ //时

{ value: "am", text: "上午" },

{ value: "pm", text: "下午" },

],

"i":[

{value: "10", text: "10分"},

{value: "20", text: "20分"},

]

}

})

dtpicker.show(function(items) {

/* * items.value 拼合后的 value

* items.text 拼合后的 text

* items.y 年,可以通过 rs.y.vaue 和 rs.y.text 获取值和文本

* items.m 月,用法同年

* items.d 日,用法同年

* items.h 时,用法同年

* items.i 分(minutes 的第二个字母),用法同年

*/

console.log(items.d); //得到选中的年

})

本文暂时没有评论,来添加一个吧(●'◡'●)

欢迎 发表评论:

最近发表
标签列表