前端 插件库（2）
1、 导入插件文件 （文件资源在我的csdn下载里面）如图：
2、 Freemarker页面上引入js 代码如下：
&link rel=&stylesheet& href=&${base}/vender/datetimepicker/jquery.datetimepicker.css&&
&script src=&${base}/vender/datetimepicker/jquery.js&&&/script&
&script src=&${base}/vender/datetimepicker/jquery.datetimepicker.js&&&/script&
3、Freemarker页面 html便签代码：
发文日期 
&input type=&text& class=&input input-auto& id=&start&
name=&startTime&
 ~ &input type=&text& class=&input input-auto& id=&end& name=&endTime&
&input type=&text& style=&display:none& class=&input input-auto& id=&ss& value=&${(lawCondition.startTime)!}&
&input type=&text& style=&display:none&class=&input input-auto& id=&ee& value=&${(lawCondition.endTime)!}&
&4、js 代码：
$(document).ready(function(){
$(&#end&).datetimepicker();
$(&#start&).datetimepicker();
alertWarn();
5、效果图：
&&相关文章推荐
* 以上用户言论只代表其个人观点，不代表CSDN网站的观点或立场
访问：46141次
积分：1925
积分：1925
排名：第19707名
原创：76篇
转载：18篇
评论：15条
(1)(4)(3)(1)(1)(2)(4)(3)(2)(9)(64)bootstrap中的日期插件datetimepicker，怎么设置让它只到年月日？ - 知乎5被浏览1655分享邀请回答该回答已被折叠 折叠原因：算法识别自动折叠01 条评论分享收藏感谢收起与世界分享知识、经验和见解今天遇到一个比较恶心的需求吧，一道工序不可垮天，通过开始时间和结束时间计算工时，可是bootstrap中的时间控件很坑
贴上原链接 &/Eonasdan/bootstrap-datetimepicker
在github的demo中可以找到只显示时分秒的方法，先贴代码
首先是定义一个标签
wmsApp.directive('timepicker', function ($parse) {
restrict: 'A',
require: '?ngModel',
link: function (scope, element, attrs, ngModelCtrl) {
var picker = $(element).datetimepicker({
format: 'HH:mm:ss',
useCurrent: false,
showTodayButton: false,
showClear: false,
showClose: false,
locale: moment.locale('zh-cn')
//model-&view
ngModelCtrl.$render = function (value) {
if (ngModelCtrl.$viewValue) {
$(element).data('DateTimePicker').date(ngModelCtrl.$viewValue);
$(element).data('DateTimePicker').clear();
//view-&model
picker.on('dp.change', function (e) {
if (e.date) {
ngModelCtrl.$setViewValue(new moment(e.date).format('YYYY-MM-DD HH:mm:ssZ'));
ngModelCtrl.$setViewValue(null);
然后html中调用
&div class="form-group" ng-class="{ 'has-error': editForm.startTime.$invalid && editForm.startTime.$dirty }"&
&label class="col-md-4 control-label"&&font color="red"&*&/font& 开始时间：&/label&
&div class='col-md-8'&
&input type='text' name="startTime" timepicker class="form-control" ng-model="model.StartTime" /&
在input中使用新定义的 timepicker标签，效果就出来了
然后就是js中的接收了，也是很坑的地方，当我编辑完时间，点击保存，后台用js获取到了时间，但是。。。。
但是，获取的时间是“当天日期”+“我选定的时分秒”，也就是说，我不管数据的数据是哪一天的8:31，js拿到的都是我电脑当前日期的8:31，这个问题是因为在定义标签的时候，
format是定义了'HH:mm:ss'，如果把年月日都带上，那界面就不是说只有时分秒了，因为我要的仅仅是时分秒，选择日期不能出现，因为我编辑的工序不可以发生跨天。
所以，在最初拿到数据的时候，就得新加一个字段，保存下来，如：
return workHourService.query(params, $scope.filter).then(function (data) {
for (var i = <span style="color: #; i & data. i++) {
data[i].Date = data[i].StartT
然后用Date的日期加上StartTime的时分秒，这样才能得到所要的数据，太坑，搞了整整一天
也请大神指点，有没有更好的方式
阅读(...) 评论()学习使用bootstrap之datetimepicker插件 - Try My Best
尽力而为 - ITeye博客
博客分类：
最近因为要做平台的移植，不能使用之前封装的时间插件。但可以用开源的bootstrap，为了方便自己以后万一还有时间控件的需求，特此记录一下吧。虽然可能大家觉得简单，但是我着实费了一番功夫，话不多少，begin！
做时间控件可以使用bootstrap的datetimepicker插件（如果只需要日期的话直接用datepicker，如果是需要起始、结束日期的范围用daterangepicker就OK），该插件是基于纯js驱动的，跟highcharts类似的原理。
首先，必要的一些css和js必须引入：
bootstrap.min.css：bootstrap的基本样式
bootstrap-datetimepicker.min.css：datetimepicker插件的样式
jquery-1.x.x.min.js：jquery，必须引入，可能不同的bootstrap需要的jquery版本不同
bootstrap.min.js：bootstrap的必要的js
bootstrap-datetimepicker.js：datetimepicker插件必须的js文件
bootstrap-datetimepicker.zh-CN.js：所支持的语言版本插件（一般在bootstrap的local目录下，这里把它单独抽出来~）
好了，我们在开始前，必须要注意：fonts（不能随意改名）目录是必须的，用来存放datetimepicker插件的一些小图片，且必须跟页面所在的目录同级。否则会出现插件的前后箭头等无法显示，如：
页面具体写法如下：（仅供参考）
&meta http-equiv="content-type" content="text/charset=utf-8" /&
&link rel="stylesheet" href="../css/bootstrap.min.css" /&
&link rel="stylesheet" href="../css/bootstrap-datetimepicker.min.css" /&
&script type="text/javascript" src="../js/jquery-1.8.3.min.js" charset="UTF-8"&&/script&
&script type="text/javascript" src="../js/bootstrap.min.js" &&/script&
&script type="text/javascript" src="../js/bootstrap-datetimepicker.js" charset="UTF-8"&&/script&
&script type="text/javascript" src="../js/bootstrap-datetimepicker.zh-CN.js" charset="UTF-8"&&/script&
&script type="text/javascript"&
$(function() {
$('.col-md-5').datetimepicker({
language: 'zh-CN',
format:'yyyy-mm-dd HH:mm',//选择完日期后，input框里的时间值的格式
startDate:new Date(),//开始日期时间，在此之前的都不可选，同理也有endDate
weekStart: 1,
autoclose: 1,
todayHighlight: 1,
startView: 2,
forceParse: 0,
showMeridian: 1
&div class="form-group"&
&label for="dtp_input2" class="col-md-2 control-label"&时间选择&/label&
&div class="input-group date form_date col-md-5" data-date="" data-date-format="" data-link-field="dtp_input2" data-link-format="yyyy-mm-dd" style="padding-right:500"&
&input class="form-control" size="16" type="text" value="" readonly style="width:150px"&
&span class="input-group-addon"&&span class="glyphicon glyphicon-remove"&&/span&&/span&
&span class="input-group-addon"&&span class="glyphicon glyphicon-calendar"&&/span&&/span&
&input type="hidden" id="dtp_input2" value="" /&&br/&
$(function(...))里的选择器不能使用id选择器，最好使用class选择器。（因为你在同一个页面中可能不止需要一次时间控件，所以不能写死一个id）；
dateformat属性决定了你input框中的值的格式。
如果你想显示中文，那么必须引入bootstrap-datetimepicker.zh-CN.js，同时language: 'zh-CN'属性也必须指定，才能显示中文。
format属性里面的格式字符串必须要用引号围起来，否则会报yyyy未定义的错误，小细节同样很重要。
选择比较【靠谱儿】的bootstrap版本也很重要，我就因为在这上面选择了不太靠谱的js版本，导致无法如愿加载出时间控件。
(129.5 KB)
下载次数: 65
Everyday都不同
浏览: 166071 次
来自: 江西
Str5=Str1+Str2+Str3+Str4,这条语句执行 ...
写的不对，http://blog.csdn.net/lian_ ...
嗯，一针见血的指出了问题，谢谢博主
poi实现excel的导入导出就是好复杂啊 还是pageoff ...
就那这个例子说，如何消费指定的offset？，比如说我消费of ...友情提示：垃圾评论一律封号...
bootstrap+datetimepicker日期时间插件
所需积分：20
亲，积分不够，多去发布资源、评论、签到、
或联系QQ人工充值
亲，vip会员下载原创作品 积分5 折。
PS:尊重原创作者劳动成果，感谢分享！
充值方式： 或联系QQ人工充值
用户名/邮箱
两周内免登录
绑定送30积分