bui.pickerdate Class
Constructor
bui.pickerdate
-
option
Parameters:
-
optionObject-
idString[ 日期生成的容器, 同时需要设置 popup:false ]
-
popupBoolean[ 是否弹出窗口 默认 true || false ]
-
maskBoolean[ 是否显示遮罩 默认 true || false ]
-
buttonsArray[ since 1.3.0 如果buttons是一个数组,则底部会增加相应的按钮 格式为 ["确定","取消"] || [{name:"确定",className:"primary"}] ]
-
valueString[ 初始化第一个日期,日期格式 2015/8/10 9:00 ]
-
minString | Date[ 最小日期,日期格式 2015/8/10 9:00 ]
-
maxString | Date[ 最大日期,日期格式 2015/8/10 9:00 ]
-
formatValueFunction[ since 1.3.0 显示的日期格式, 默认: yyyy-MM-dd hh:mm:ss ]
-
colsObject[ 分栏 ]
-
yearObject | "none"[ 不需要某栏,设置为 "none" 格式: { values: [],displayValues:[] } ] -
monthObject | "none"[ 不需要某栏,设置为 "none" 格式: { values: [],displayValues:[] } ] -
dateObject | "none"[ 不需要某栏,设置为 "none" 格式: { values: [],displayValues:[] } ] -
hourObject | "none"[ 不需要某栏,设置为 "none" 格式: { values: [],displayValues:[] } ] -
minuteObject | "none"[ 不需要某栏,设置为 "none" 格式: { values: [],displayValues:[] } ] -
secondObject | "none"[ 不需要某栏,设置为 "none" 格式: { values: [],displayValues:[] } ]
-
-
[appendTo]String | Object optional[ 1.4.3新增 默认:"body",添加到哪里去,主要配合单页使用 ]
-
rotateEffectBoolean[ 是否开启3D效果,默认:false ]
-
onChangeFunction[ 回调 ]
-
callbackFunction[ 点击确定的回调 ]
-
Example:
// 1. 无底部按钮初始化
var input = $("#datepicker_input");
var uiPickerdate = bui.pickerdate({
handle:"#datepicker_input",
value: '2015/8/10 9:00',
min: '2014/4/5 9:00',
max: '2016/4/5 10:00',
onChange: function(value) {
input.val(value);
}
});// 2. 带底部按钮的初始化
var datePrevVal;
var input = $("#datepicker_input");
var uiPickerdate = bui.pickerdate({
// id: "#datepicker_contanier",
handle:"#datepicker_input",
value: '2015/8/10 9:00',
onChange: function(value) {
input.val(value);
},
// 如果需要按钮,需要自己写callback
buttons: ["取消","确定"],
callback: function () {
// 取消返回上一个值
if( $(this).text().trim() == "取消"){
uiPickerdate.value(datePrevVal);
}else{
datePrevVal = uiPickerdate.value();
}
}
});
// 获取上一个值
datePrevVal = uiPickerdate.value();Item Index
Methods
cols
-
cols
设置分栏
Parameters:
-
colsObject[ {} ]
-
yearObject[ 'none' || 年份 ]
-
valuesArray[ 年份的值 ] -
displayValuesArray[ 年份的值对应的文本 ]
-
-
monthObject[ 'none' || 月份 ]
-
valuesArray[ 月份的值 ] -
displayValuesArray[ 月份的值对应的文本 ]
-
-
dateObject[ 'none' || 日 ]
-
valuesArray[ 日 ] -
displayValuesArray[ 日对应的文本 ]
-
-
hourObject[ 'none' || 时 ]
-
valuesArray[ 时 ] -
displayValuesArray[ 时对应的文本 ]
-
-
minuteObject[ 'none' || 分 ]
-
valuesArray[ 分 ] -
displayValuesArray[ 分对应的文本 ]
-
-
secondObject[ 'none' || 秒 ]
-
valuesArray[ 秒 ] -
displayValuesArray[ 秒对应的文本 ]
-
-
Example:
//设置分栏
uiPickerdate.cols({
year: {
values: [2013, 2014, 2015],
},
hour: {
values: [8, 9, 10, 11, 13, 14, 15, 16, 17]
},
minute: {
values: [0, 30],
displayValues: ['00', '30']
},
second: 'none'
});destroy
-
[bool]
[销毁控件]
Parameters:
-
[bool]Boolean optional[ 默认: false 销毁部分 | true 销毁全部 ]
Example:
//销毁
uiPickerdate.destroy();disabled
()
chainable
阻止触发
Example:
uiPickerdate.disabled();enabled
()
chainable
允许触发
Example:
uiPickerdate.enabled();formatValue
-
[str]
格式化后回调
Parameters:
-
[str]String optional[ "yyyy-MM-dd hh:00:00" ]
Example:
//设置某个日期
uiPickedate.formatValue("yyyy-MM-dd hh:00:00");max
-
[max]
设置最大日期
Parameters:
-
[max]String optional[ 默认最大日期:'2030/01/01 00:00:00' ]
Example:
//设置最大日期
uiPickedate.max('2030/01/01 00:00:00');min
-
[min]
设置最小日期
Parameters:
-
[min]String optional[ 默认最小日期:'1960/01/01 00:00:00' ]
Example:
//设置最小日期
uiPickedate.min('1960/01/01 00:00:00');onChange
-
[callback]
日期改变的回调
Parameters:
-
[callback]Function optional[ 日期改变实时监听回调 ]
Example:
//设置某个日期
uiPickedate.onChange(function(value) {
// body...
});reset
()
重新渲染
Example:
//设置某个日期
uiPickedate.reset();value
-
[date]
设置某个日期
Parameters:
-
[date]String optional[ 日期格式:'2030/01/01 00:00:00' ]
Example:
//设置某个日期
uiPickedate.value('2016/07/01 00:00:00');widget
-
[name]
获取依赖的控件
Parameters:
-
[name]String optional[ 依赖控件名 dialog ]
Example:
//获取依赖控件
var uiPickerdateWidget = uiPickerdate.widget();Events
off
为控件取消绑定事件
Event Payload:
-
[type]String optional[ 事件类型: "change"(日期改变的时候) | "show"(日期展示的时候)| "hide"(日期隐藏的时候) ]
-
[callback]Function optional[ 绑定的事件, this 为当前点击的菜单 ]
Example:
uiPickerdate.off("show");on
为控件绑定事件
Event Payload:
-
[type]String optional[ 事件类型: "change"(日期改变的时候) | "show"(日期展示的时候)| "hide"(日期隐藏的时候) ]
-
[callback]Function optional[ 绑定的事件, this 为当前点击的菜单 ]
Example:
uiPickerdate.on("show",function () {
// 点击的菜单
console.log(this);
});