如何在jquery datepicker中执行此效果?
我点击项目(例如文本框),其中包含2016-12-28格式的日期。 给定日期的示例是星期三。
我想点击打开一个小日历(datepicker),其中有效 从星期一到星期五只有几天包含这个日期。
答案 0 :(得分:0)
我调整了答案,以便在给定日期的星期五到达星期五:JavaScript - get the first day of the week from current date
首先,在文本框中输入日期的星期一和星期五的日期。然后设置日期选择器的最长和最短日期。
上查看我的解决方案<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
<input type="text" id="tbDate" class="datepicker" value="2016-12-28" />
<script type="text/javascript">
$(document).ready(
function() {
//GET THE DATE FROM THE TEXT BOX
var placeholder = $("#tbDate").val();
//MAKE A DATE FROM THE TEXT BOX VALUE
d = new Date(placeholder);
//MAKE THE TEXT BOX A DATE PICKER
$(".datepicker").datepicker({
minDate: x(d), //SET THE MIN ALLOWED DATE FOR YOUR DATE PICKER
maxDate: y(d), //SET THE MAX ALLOWED DATE FOR YOUR DATE PICKER
numberOfMonths: 2,
beforeShowDay: $.datepicker.noWeekends,
dateFormat: 'yy-mm-dd'
});
});
//FIND THE DAYS OF WEEK DESIRED FOR THE WEEK OF GIVEN DATE
function x(d) {
var date = new Date(d);
if (date.getDay() > 0) {
date.setDate(date.getDate() - (date.getDay() - 1));
return date;
} else {
return date;
}
}
function y(d){
var date = new Date(d);
if (date.getDay() < 6) {
date.setDate(date.getDate() + ((6 - date.getDay())));
return date;
} else {
return date;
}
}
</script>
答案 1 :(得分:0)
我试着这样:
$('.oz_m_data').click(function() {
//GET THE DATE FROM THE TEXT BOX
var placeholder = $(this).val();
//MAKE A DATE FROM THE TEXT BOX VALUE
d = new Date(placeholder);
//MAKE THE TEXT BOX A DATE PICKER
$(this).datepicker({
minDate: x(d), //SET THE MIN ALLOWED DATE FOR YOUR DATE PICKER
maxDate: y(d), //SET THE MAX ALLOWED DATE FOR YOUR DATE PICKER
numberOfMonths: 1,
beforeShowDay: $.datepicker.noWeekends,
dateFormat: 'yy-mm-dd'
}).datepicker( "show" );