Merge 35095f2dd0
into bfc0c1bf6d
commit
745ef8fa53
|
@ -18,3 +18,6 @@ node_modules/
|
|||
_site/
|
||||
release/
|
||||
.npmignore
|
||||
yarn*
|
||||
*.log
|
||||
*.lock
|
||||
|
|
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
@ -377,8 +377,8 @@
|
|||
, range: false //是否开启范围选择,即双控件
|
||||
, format: 'yyyy-MM-dd' //默认日期格式
|
||||
, value: null //默认日期,支持传入new Date(),或者符合format参数设定的日期格式字符
|
||||
,min: '1900-1-1' //有效最小日期,年月日必须用“-”分割,时分秒必须用“:”分割。注意:它并不是遵循 format 设定的格式。
|
||||
,max: '2099-12-31' //有效最大日期,同上
|
||||
, min: '1900-1-1 00:00:00' //有效最小日期,年月日必须用“-”分割,时分秒必须用“:”分割。注意:它并不是遵循 format 设定的格式。
|
||||
, max: '2099-12-31 23:59:59' //有效最大日期,同上
|
||||
, trigger: 'focus' //呼出控件的事件
|
||||
, show: false //是否直接显示,如果设置true,则默认直接显示控件
|
||||
, showBottom: true //是否显示底部栏
|
||||
|
@ -391,6 +391,7 @@
|
|||
, zIndex: null //控件层叠顺序
|
||||
, done: null //控件选择完毕后的回调,点击清空/现在/确定也均会触发
|
||||
, change: null //日期时间改变后的回调
|
||||
, container: '' // 日期组件容器
|
||||
};
|
||||
|
||||
//多语言
|
||||
|
@ -718,7 +719,21 @@
|
|||
that.remove(Class.thisElemDate);
|
||||
|
||||
//如果是静态定位,则插入到指定的容器中,否则,插入到body
|
||||
isStatic ? options.elem.append(elem) : (
|
||||
// 优先插入到指定的容器里
|
||||
var container;
|
||||
switch (typeof options.container) {
|
||||
case 'string':
|
||||
try {
|
||||
container = document.querySelector(options.container);
|
||||
} catch (e) { }
|
||||
break;
|
||||
case 'object':
|
||||
break;
|
||||
default:
|
||||
container = 0;
|
||||
}
|
||||
|
||||
container ? container.append(elem) : isStatic ? options.elem.append(elem) : (
|
||||
document.body.appendChild(elem)
|
||||
, that.position() //定位
|
||||
);
|
||||
|
@ -969,12 +984,13 @@
|
|||
, options = that.config, timestrap = {}
|
||||
, dateTime = options[index > 41 ? 'endDate' : 'dateTime']
|
||||
, isOut, thisDateTime = lay.extend({}, dateTime, date || {});
|
||||
|
||||
lay.each({
|
||||
now: thisDateTime
|
||||
, min: options.min
|
||||
, max: options.max
|
||||
}, function (key, item) {
|
||||
timestrap[key] = that.newDate(lay.extend({
|
||||
timestrap[key] = that.newDate(lay.extend(options.type === 'time' ? {} : {
|
||||
year: item.year
|
||||
, month: item.month
|
||||
, date: item.date
|
||||
|
@ -1202,6 +1218,11 @@
|
|||
} else {
|
||||
that[startEnd] = dateTime;
|
||||
}
|
||||
// 使当前时间在最大最小区间
|
||||
lay.each(['hours', 'minutes', 'seconds'], function (i, item) {
|
||||
that[startEnd][item] = Math.max(Math.min(options.max[item], that[startEnd][item]), options.min[item]);
|
||||
});
|
||||
|
||||
lay.each([24, 60, 60], function (i, item) {
|
||||
var li = lay.elem('li'), childUL = ['<p>' + lang.time[i] + '</p><ol>'];
|
||||
lay.each(new Array(item), function (ii) {
|
||||
|
|
|
@ -0,0 +1,136 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>测试</title>
|
||||
<script src="../src/laydate.js"></script>
|
||||
<style>
|
||||
.line {
|
||||
display: inline-block;
|
||||
width: 200px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<p>日期选择(固定页面位置)</p>
|
||||
<div class="line">
|
||||
<input class="date" id="start" placeholder="请选择开始日期" />
|
||||
</div>
|
||||
<div class="line">
|
||||
<input class="date" id="end" placeholder="请选择结束日期" />
|
||||
</div>
|
||||
|
||||
<p>时间选择</p>
|
||||
<div class="line">
|
||||
<input class="date" id="start1" placeholder="请选择开始时间" />
|
||||
</div>
|
||||
<div class="line">
|
||||
<input class="date" id="end1" placeholder="请选择结束时间" />
|
||||
</div>
|
||||
|
||||
<p>日期选择(指定控件容器)</p>
|
||||
<div class="line">
|
||||
<input class="date" id="start2" placeholder="请选择开始日期" />
|
||||
<div id="start2_date"></div>
|
||||
</div>
|
||||
<div class="line">
|
||||
<input class="date" id="end2" placeholder="请选择结束日期" />
|
||||
<div id="end2_date"></div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function setAtts(obj, target) {
|
||||
for (var key in target) {
|
||||
obj[key] = target[key];
|
||||
}
|
||||
}
|
||||
|
||||
// 日期选择(固定页面位置)
|
||||
var start = laydate.render({
|
||||
elem: '#start',
|
||||
change: console.log,
|
||||
done: function (value, date) {
|
||||
setAtts(end.config.min, {
|
||||
year: date.year || 1900,
|
||||
month: date.month && --date.month || 1,// 因为js Date月是从0开始的...
|
||||
date: date.date || 1
|
||||
});
|
||||
}
|
||||
});
|
||||
var end = laydate.render({
|
||||
elem: '#end',
|
||||
change: console.log,
|
||||
done: function (value, date) {
|
||||
setAtts(start.config.max, {
|
||||
year: date.year || 2099,
|
||||
month: date.month && --date.month || 12,// 因为js Date月是从0开始的...
|
||||
date: date.date || 30
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
// 时间选择
|
||||
var start1 = laydate.render({
|
||||
elem: '#start1',
|
||||
type: 'time',
|
||||
change: console.log,
|
||||
done: function (value, date) {
|
||||
setAtts(end1.config.min, {
|
||||
hours: date.hours || 0,
|
||||
minutes: date.minutes || 0,
|
||||
seconds: date.seconds || 0
|
||||
});
|
||||
}
|
||||
});
|
||||
var end1 = laydate.render({
|
||||
elem: '#end1',
|
||||
type: 'time',
|
||||
change: console.log,
|
||||
done: function (value, date) {
|
||||
setAtts(start1.config.max, {
|
||||
hours: date.hours || 23,
|
||||
minutes: date.minutes || 59,
|
||||
seconds: date.seconds || 59
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
// 日期选择(指定控件容器)
|
||||
var start2 = laydate.render({
|
||||
elem: '#start2',
|
||||
container: '#start2_date',
|
||||
type: 'datetime',
|
||||
change: console.log,
|
||||
done: function (value, date) {
|
||||
setAtts(end2.config.min, {
|
||||
year: date.year || 1900,
|
||||
month: date.month && --date.month || 1,// 因为js Date月是从0开始的...
|
||||
date: date.date || 1,
|
||||
hours: date.hours || 0,
|
||||
minutes: date.minutes || 0,
|
||||
seconds: date.seconds || 0
|
||||
});
|
||||
}
|
||||
});
|
||||
var end2 = laydate.render({
|
||||
elem: '#end2',
|
||||
container: '#end2_date',
|
||||
type: 'datetime',
|
||||
change: console.log,
|
||||
done: function (value, date) {
|
||||
setAtts(start2.config.max, {
|
||||
year: date.year || 2099,
|
||||
month: date.month && --date.month || 12,// 因为js Date月是从0开始的...
|
||||
date: date.date || 30,
|
||||
hours: date.hours || 23,
|
||||
minutes: date.minutes || 59,
|
||||
seconds: date.seconds || 59
|
||||
});
|
||||
}
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
Loading…
Reference in New Issue