在日期选择器中显示当前日期
Display Current date in the datepicker
目标:
检索当前日期,然后在"数据日期"(中的"开始"answers"结束"日期(以及id的"开始日期"answers"终止日期"中超过该日期。
问题:
代码:
var d = new Date();
var strDate = d.getFullYear() + "-" + (d.getMonth()+1) + "-" + d.getDate();
$('.dp4').html(strDate);
$('.dp5').html(strDate);
$('#startDate2').html(strDate);
$('#endDate2').html(strDate);
当我使用JSFiddle时效果很好,但当我将其与日期选择器结合使用时效果不佳。
找不到问题。
https://jsfiddle.net/cszwtnsv/
http://www.eyecon.ro/bootstrap-datepicker/
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Datepicker for Bootstrap, from Twitter</title>
<link href="css/bootstrap.css" rel="stylesheet">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<link href="C:'1'Datepicker for Bootstrap, from Twitter_files'datepicker.css" rel="stylesheet">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<script src="C:'1'Datepicker for Bootstrap, from Twitter_files'jquery.js"></script>
<script src="C:'1'Datepicker for Bootstrap, from Twitter_files'bootstrap-datepicker.js"></script>
<script>
if (top.location != location) {
top.location.href = document.location.href ;
}
$(function(){
window.prettyPrint && prettyPrint();
$('#dp1').datepicker({
format: 'mm-dd-yyyy'
});
$('#dp2').datepicker();
$('#dp3').datepicker();
$('#dp3').datepicker();
$('#dpYears').datepicker();
$('#dpMonths').datepicker();
var startDate = new Date(2015,1,20);
var endDate = new Date(2015,1,25);
$('#dp4').datepicker()
.on('changeDate', function(ev){
if (ev.date.valueOf() > endDate.valueOf()){
$('#alert').show().find('strong').text('The start date can not be greater then the end date');
} else {
$('#alert').hide();
startDate = new Date(ev.date);
$('#startDate').text($('#dp4').data('date'));
}
$('#dp4').datepicker('hide');
});
$('#dp5').datepicker()
.on('changeDate', function(ev){
if (ev.date.valueOf() < startDate.valueOf()){
$('#alert').show().find('strong').text('The end date can not be less then the start date');
} else {
$('#alert').hide();
endDate = new Date(ev.date);
$('#endDate').text($('#dp5').data('date'));
}
$('#dp5').datepicker('hide');
});
// disabling dates
var nowTemp = new Date();
var now = new Date(nowTemp.getFullYear(), nowTemp.getMonth(), nowTemp.getDate(), 0, 0, 0, 0);
var checkin = $('#dpd1').datepicker({
onRender: function(date) {
return date.valueOf() < now.valueOf() ? 'disabled' : '';
}
}).on('changeDate', function(ev) {
if (ev.date.valueOf() > checkout.date.valueOf()) {
var newDate = new Date(ev.date)
newDate.setDate(newDate.getDate() + 1);
checkout.setValue(newDate);
}
checkin.hide();
$('#dpd2')[0].focus();
}).data('datepicker');
var checkout = $('#dpd2').datepicker({
onRender: function(date) {
return date.valueOf() <= checkin.date.valueOf() ? 'disabled' : '';
}
}).on('changeDate', function(ev) {
checkout.hide();
}).data('datepicker');
});
</script>
<script>
var d = new Date();
var strDate = d.getFullYear() + "-" + (d.getMonth()+1) + "-" + d.getDate();
$('.dp4').html(strDate);
$('.dp5').html(strDate);
$('#startDate').html(strDate);
$('#endDate').html(strDate);
</script>
<style>
.container {
background: #fff;
}
#alert {
display: none;
}
</style>
</head>
<body>
<div class="container">
<section id="typeahead">
<div class="row">
<div class="span9 columns">
<div class="well">
<div class="alert alert-error" id="alert">
<strong>Oh snap!</strong>
</div>
<table class="table">
<thead>
<tr>
<th>Start date<a href="#" class="btn small" id="dp4" data-date-format="yyyy-mm-dd" data-date="2015-2-21">Change</a></th>
<th>End date<a href="#" class="btn small" id="dp5" data-date-format="yyyy-mm-dd" data-date="2015-2-25">Change</a></th>
</tr>
</thead>
<tbody>
<tr>
<td id="startDate">
</td>
<td id="endDate">
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</section>
</div>
</body>
</html>
可能是您的字符串
var strDate = d.getFullYear() + "-" + (d.getMonth()+1) + "-" + d.getDate();
"2015-6-11"与格式"2015-06-11"(yyyy-mm-dd(不匹配
相关文章:
- JavasScript|显示当前日期
- 创建程序以显示当前日期和时间
- 显示当前日期两次
- 如何在 HTML 中使用占位符在文本框中显示当前日期
- 在文本框中显示当前日期 - JavaScript
- 在文本框中显示当前日期前 270 天
- jQuery Datepicker 显示当前日期
- 用momentjs显示当前日期
- 每次单击按钮时显示当前日期
- 如何通过在检查器中操作Javascript来抓取表?页面仅显示当前日期's的数据,但我想回到过去,重新收集
- 用Javascript显示当前日期
- 在hta应用程序中使用HTML和Javascript显示当前日期和时间,并具有可滚动的效果
- 如何使用完整日历显示当前日期
- javascript函数显示当前日期和时间点击清除
- 在画布上显示当前日期和时间使用JS
- 如何使用jquery显示当前日期和时间AM PM和CST
- 自定义日历,显示当前日期的下一个六个月日历
- Jquery UI日历-如何突出显示当前日期之后的天数
- Angularjs - 显示当前日期
- 在日期选择器中显示当前日期