Bootstrap datetimepicker 时间插件

最新推荐文章于 2024-04-10 19:59:36 发布

原创最新推荐文章于 2024-04-10 19:59:36 发布 · 1.3k 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#datetimepicker #Bootstrap

前端插件库专栏收录该内容

6 篇文章

订阅专栏

本文介绍如何在Freemarker模板中集成Datetimepicker插件，实现日期选择功能。包括插件导入、JS代码配置及页面展示效果。

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、效果图：

Bootstrap datetimepicker 时间插件

1 条评论