【问题标题】:how to get Monday as first day in jquery datepicker如何在jquery datepicker中将星期一作为第一天
【发布时间】:2017-04-05 21:06:40
【问题描述】:
如果你运行代码 sn-p,你会看到星期一是第 7 天,我怎样才能得到星期一作为一周的第一天
例子:
星期一 05/01/2017 第 1 周
2017 年 5 月 2 日星期二第 2 周
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script type="text/javascript" src="/scripts/jquery.ui.datepicker-it.js"></script>
<script>
$(function() {
var weekStart = new Date(2017, 1, 27);
var roster = ['work', 'off', 'off', 'work', 'work', 'work', 'work',
'off', 'work', 'work', 'work', 'off', 'off', 'work'];
$('#date').datepicker({minDate: weekStart, onSelect: function(dateStr) {
var date = $(this).datepicker('getDate');
var days = Math.floor((date.getTime() - weekStart.getTime()) / (24 * 60 * 60 * 1000));
var week = Math.floor(days / 7) % 2;
$('#week').val(week + 1);
$('#day').val($.datepicker.formatDate('DD', date));
$('#work').val(roster[week * 7 + date.getDay() - 1]);
}});
});
</script>
</head>
<body>
<p>Date: <input type="text" id="date"></p>
<p>Day: <input type="text" id="day"></p>
<p>week: <input type="text" id="week"></p>
<p>work: <input type="text" id="work"></p>
</body>
</html>
【问题讨论】:
标签:
javascript
jquery
html
date
【解决方案1】:
您缺少firstDay: 1 参数。
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script type="text/javascript" src="/scripts/jquery.ui.datepicker-it.js"></script>
<script>
$(function() {
var weekStart = new Date(2017, 1, 27);
var roster = ['work', 'off', 'off', 'work', 'work', 'work', 'work',
'off', 'work', 'work', 'work', 'off', 'off', 'work'];
$('#date').datepicker({ firstDay: 1, minDate: weekStart, onSelect: function(dateStr) {
var date = $(this).datepicker('getDate');
var days = Math.floor((date.getTime() - weekStart.getTime()) / (24 * 60 * 60 * 1000));
var week = Math.floor(days / 7) % 2;
$('#week').val(week + 1);
$('#day').val($.datepicker.formatDate('DD', date));
$('#work').val(roster[week * 7 + date.getDay() - 1]);
}});
});
</script>
</head>
<body>
<p>Date: <input type="text" id="date"></p>
<p>Day: <input type="text" id="day"></p>
<p>week: <input type="text" id="week"></p>
<p>work: <input type="text" id="work"></p>
</body>
</html>
【解决方案2】:
我的答案是月到 0
var weekStart = new Date(2017, 0, 27);
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script type="text/javascript" src="/scripts/jquery.ui.datepicker-it.js"></script>
<script>
$(function() {
var weekStart = new Date(2017, 0, 27);
var roster = ['work', 'off', 'off', 'work', 'work', 'work', 'work',
'off', 'work', 'work', 'work', 'off', 'off', 'work'];
$('#date').datepicker({ firstDay: 1, minDate: weekStart, onSelect: function(dateStr) {
var date = $(this).datepicker('getDate');
var days = Math.floor((date.getTime() - weekStart.getTime()) / (24 * 60 * 60 * 1000));
var week = Math.floor(days / 7) % 2;
$('#week').val(week + 1);
$('#day').val($.datepicker.formatDate('DD', date));
$('#work').val(roster[week * 7 + date.getDay() - 1]);
}});
});
</script>
</head>
<body>
<p>Date: <input type="text" id="date"></p>
<p>Day: <input type="text" id="day"></p>
<p>week: <input type="text" id="week"></p>
<p>work: <input type="text" id="work"></p>
</body>
</html>