您的位置：首页 > Web前端 > BootStrap

bootstrap datetimepicker的时间变成1899年

2014-11-25 09:40 337 查看

bootstrap datetimepicker 重新加载后，日期会变1899年，

这个问题要怎么解决呢？？

先看个小例子：

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="DateTimePickQuestion1.WebForm1" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<title></title>



<link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.0/css/bootstrap.min.css">



<link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.0/css/bootstrap-theme.min.css">



<script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script>



<script src="http://cdn.bootcss.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>



<script src="js/bootstrap-datetimepicker.js" type="text/javascript"></script>

<script src="js/locales/bootstrap-datetimepicker.zh-CN.js" type="text/javascript"></script>

<link href="css/bootstrap-datetimepicker.css" rel="stylesheet" type="text/css" />



<script type="text/javascript">

$(function () {

$("#mySelect").change(function () {

$(".form_datetime").datetimepicker('remove');

var type = $("#mySelect").val();

switch (type) {

case "month":

$('.form_datetime').datetimepicker({

autoclose: true,

startView: 'year',

minView: 'year',

format: 'yyyy-mm'

});

break;

case "year":

$('.form_datetime').datetimepicker({

autoclose: true,

startView: 'decade',

minView: 'decade',

format: 'yyyy'

});

break;

} //end switch

})//end change

})//end ready

</script>

</head>

<body>

<div>

<select id='mySelect'>

<option value='year'>year</option>

<option value='month'>month</option>

</select>

<div class="input-group date form_datetime col-md-2" data-date='2014-1-1'>

<input class="form-control" type="text" />

<span class="input-group-addon">

<span class="glyphicon glyphicon-th"></span>

</span>

</div>

</div>

</body>

</html>

上面的小例子就是用 select 标签重新加载不同的datetimepicker

问题就出现在 datetimepicker remove之后，他的时间就变成了 1899年

如图:

要怎么解决这个问题呢？

这里给出一个小小的办法：

就是在你remove datetimepicker之后

使用一下datetimepicker 的 update方法

代码如下：

$("#mySelect").change(function () {

$(".form_datetime").datetimepicker('remove');

var type = $("#mySelect").val();

switch (type) {

case "month":

$('.form_datetime').datetimepicker({

autoclose: true,

startView: 'year',

minView: 'year',

format: 'yyyy-mm'

});

$('.form_datetime').datetimepicker('update', new Date());

break;

case "year":

$('.form_datetime').datetimepicker({

autoclose: true,

startView: 'decade',

minView: 'decade',

format: 'yyyy'

});

$('.form_datetime').datetimepicker('update', new Date());

break;

} //end switch

})//end change

用了update -->new Date（）之后就可以回到今天了！！！

另外想提醒的是：

datetimepicker的startDate属性指的是：

The earliest date that may be selected; all earlier dates will be disabled.

最小的选择时间，比这个最小选择时间小的日期无法选择

最后想说的是 bootstrap datetimepicker 的网站是https://github.com/smalot/bootstrap-datetimepicker

里面有很多说明的，自己看把

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航