bootstrap-datetimepicker实现只显示到日期的方法


Posted in Javascript onNovember 25, 2016

本文实例讲述了bootstrap-datetimepicker实现只显示到日期的方法。分享给大家供大家参考,具体如下:

bootstrap-datetimepicker 一般都是设置到时分秒,有时候并不需要,怎么处理呢?

minView: "month", //选择日期后,不会再跳转去选择时分秒

bootstrap-datetimepicker实现只显示到日期的方法

1.引入

<link href="Public/css/bootstrap.min.css" type="text/css" rel="stylesheet">
<script type="text/javascript" src="{sh::PUB}js/jquery-1.10.2.min.js"></script>
<link type="text/css" rel="stylesheet" href="{sh::PUB}css/bootstrap-datetimepicker.min.css">
<script src="{sh::PUB}js/bootstrap-datetimepicker.min.js" type="text/javascript" /></script>
<script src="{sh::PUB}js/bootstrap-datetimepicker.zh-CN.js" type="text/javascript" /></script>

2.配置

// 日历
$('.form_datetime').datetimepicker({
  minView: "month", //选择日期后,不会再跳转去选择时分秒
  language: 'zh-CN',
  format: 'yyyy-mm-dd',
  todayBtn: 1,
  autoclose: 1,
});

3.html

<div class="form-group row">
  <div class="left col-xs-3 text-right">
    <label for="">*时间:</label>
  </div>
  <div class="right col-xs-6 text-left">
    <div class="input-group">
     <input type="text" class="form-control form_datetime" id="addtime" name="addtime" value="{sh:$info.addtime|default=$time|date='Y-m-d',###}" placeholder="">
     <span class="input-group-addon" id="basic-addon2"><span class="glyphicon glyphicon-time" aria-hidden="true"></span></span>
    </div>
  </div>
</div>

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
js DOM 元素ID就是全局变量
Sep 20 Javascript
javascript用函数实现对象的方法
May 14 Javascript
判断输入的字符串是否是日期格式的简单方法
Jul 11 Javascript
关于jquery中动态增加select,事件无效的快速解决方法
Aug 29 Javascript
微信小程序 textarea 详解及简单使用方法
Dec 05 Javascript
js实现颜色阶梯渐变效果(Gradient算法)
Mar 21 Javascript
react.js CMS 删除功能的实现方法
Apr 17 Javascript
Angular浏览器插件Batarang介绍及使用
Feb 07 Javascript
vue iView 上传组件之手动上传功能
Mar 16 Javascript
9102年webpack4搭建vue项目的方法步骤
Feb 20 Javascript
怎样在vue项目下添加ESLint的方法
May 16 Javascript
vue使用i18n实现国际化的方法详解
Sep 05 Javascript
利用angular.copy取消变量的双向绑定与解析
Nov 25 #Javascript
JS冒泡事件与事件捕获实例详解
Nov 25 #Javascript
js事件源window.event.srcElement兼容性写法(详解)
Nov 25 #Javascript
使用JS读取XML文件的方法
Nov 25 #Javascript
JS比较两个数值的大小实例
Nov 25 #Javascript
使用JavaScript解决网页图片拉伸问题(推荐)
Nov 25 #Javascript
js移动焦点到最后位置的简单方法
Nov 25 #Javascript
You might like
PHP中$_FILES的使用方法及注意事项说明
2014/02/14 PHP
php实现TCP端口检测的方法
2015/04/01 PHP
workerman结合laravel开发在线聊天应用的示例代码
2018/10/30 PHP
Laravel 中创建 Zip 压缩文件并提供下载的实现方法
2019/04/02 PHP
在JavaScript中使用inline函数的问题
2007/03/08 Javascript
JavaScript window.setTimeout() 的详细用法
2009/11/04 Javascript
加载jQuery后$冲突的解决办法
2010/07/09 Javascript
理解Javascript_13_执行模型详解
2010/10/20 Javascript
基于jquery的从一个页面跳转到另一个页面的指定位置的实现代码(带平滑移动的效果)
2011/05/24 Javascript
js遍历td tr等html元素
2012/12/13 Javascript
JQuery右键菜单插件ContextMenu使用指南
2014/12/19 Javascript
JavaScript中的console.assert()函数介绍
2014/12/29 Javascript
JS实现跟随鼠标闪烁转动色块的方法
2015/02/26 Javascript
用js将long型数据转换成date型或datetime型的实例
2017/07/03 Javascript
鼠标拖动改变DIV等网页元素的大小的实现方法
2017/07/06 Javascript
vue 使用Jade模板写html,stylus写css的方法
2018/02/23 Javascript
详解Vue 多级组件透传新方法provide/inject
2018/05/09 Javascript
探秘vue-rx 2.0(推荐)
2018/09/21 Javascript
如何安装控制器JavaScript生成插件详解
2018/10/21 Javascript
微信小程序开发之map地图组件定位并手动修改位置偏差
2019/08/17 Javascript
jQuery实现朋友圈查看图片
2020/09/11 jQuery
Python 专题五 列表基础知识(二维list排序、获取下标和处理txt文本实例)
2017/03/20 Python
LRUCache的实现原理及利用python实现的方法
2017/11/21 Python
python爬虫正则表达式之处理换行符
2018/06/08 Python
Django之choices选项和富文本编辑器的使用详解
2020/04/01 Python
python实现PolynomialFeatures多项式的方法
2021/01/06 Python
css3media响应式布局实例
2016/07/08 HTML / CSS
加拿大女鞋品牌:ALDO
2016/11/13 全球购物
eBay法国购物网站:eBay.fr
2017/10/21 全球购物
Bodum官网:咖啡和茶壶、玻璃器皿、厨房电器等
2018/08/01 全球购物
新加坡最早生产电动滑板车的制造商之一:FunsToTheFore
2020/09/08 全球购物
导游个人求职信
2014/04/25 职场文书
大学社团活动总结
2014/04/26 职场文书
销售区域经理岗位职责
2015/04/10 职场文书
企业文化学习心得体会
2016/01/21 职场文书
简单总结SpringMVC拦截器的使用方法
2021/06/28 Java/Android