bootstrap-datepicker使用
程序员文章站
2022-05-25 21:17:16
...
下载地址:https://github.com/uxsolutions/bootstrap-datepicker
1、引入相关css/js
<script src="js/jquery-3.2.1.js"></script>
<script src="js/bootstrap-datepicker.min.js"></script>
<script src="js/locales/bootstrap-datepicker.zh-CN.js"></script>
2、输入框
<input type="text" id="input_date" class="datepicker form-control" />
3、js
$('.datepicker').datepicker({
minView: "day", // 选择时间时,最小可以选择到那层;默认是‘hour’也可用0表示
language: 'zh-CN', // 语言
autoclose: true, // true:选择时间后窗口自动关闭
format: 'yyyy-mm-dd', // 文本框时间格式,设置为0,最后时间格式为2017-03-23 17:00:00
//todayBtn: true, // 如果此值为true 或 "linked",则在日期时间选择器组件的底部显示一个 "Today" 按钮用以选择当前日期。
defaultViewDate: true,
/*todayBtn:'linked',
todayHighlight: 1*/
});
4、date-range
html:
<div class="input-group input-daterange datepicker">
<input type="text" class="form-control" value="">
<div class="input-group-addon">到</div>
<input type="text" class="form-control" value="">
</div>
js:
$(".datepicker").datepicker({
language: "zh-CN",
autoclose: true
});
推荐阅读
-
省点花锦鲤卡app怎么激活 省点花锦鲤卡激活后怎么使用
-
Android自定义View 使用PathMeasure简单模仿系统ProgressBar(四)
-
solidworks零件模型怎么使用剖面命令?
-
Android studio怎么使用git获取最新内容然后合并?
-
省点花锦鲤卡可以在美团上使用吗 省点花锦鲤卡app怎么在美团上用
-
Wing FTP Server FTP服务器端中文版安装使用教程
-
eclipse格式化代码快捷键无法使用怎么办?
-
android使用DataBinding来设置空状态
-
IDPhotoStudio证件照打印使用教程
-
百中搜优化软件怎么样?百中搜优化软件使用教程(附视频教程)