时间框偏移解决办法

首先导入js和css文件

<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
<link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
<script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> <script src="https://cdn.bootcss.com/moment.js/2.18.1/moment-with-locales.min.js"></script>
<link href="https://cdn.bootcss.com/bootstrap-datetimepicker/4.17.47/css/bootstrap-datetimepicker.min.css" rel="stylesheet">
<script src="https://cdn.bootcss.com/bootstrap-datetimepicker/4.17.47/js/bootstrap-datetimepicker.min.js"></script>

添加input文本框

 <div class='col-sm-6'>
<input type='text' class="form-control" id='datetime' />
</div>

添加js代码

<script>
$(function () {
$("#datetime").datetimepicker({
format: 'YYYY-MM-DD hh:mm',
locale: moment.locale('zh-cn')
});
});
</script>

文本框必须处在一个绝对定位的框架内,比如:

  <td>
<label class="control-label">日期:</label>
</td>
<td style="position:relative;">
<input type="text" class="form-control" id="datetime">
</td>

如果像下面这样没有绝对定位,则会产生错误datetimepicker component should be placed within a non-static positioned container

bootstrap的日期选择器的更多相关文章

  1. 日期选择器(Query+bootstrap和js两种方式)

    日期选择是在下拉列表中选择年.月.日,年显示前后的五年,12个月,日就是有30.31.29.28天的区别,随着月份的变而变 一.js方式的日期选择 (1)首先就是三个下拉列表了,点击年.月.日显示列表 ...

  2. Angularjs与bootstrap.datetimepicker结合实现日期选择器

    http://www.lovelucy.info/angularjs-best-practices.html http://damoqiongqiu.iteye.com/blog/1917971 ht ...

  3. 基于bootstrap模态框的日期选择器

    近来由于工作需求,以bootstrap模态框+DIV+CSS+JS做了一个适用于移动端的日期选择器,能够满足多样的需求,目前处于第一个版本,后续可能会继续更新.废话不多说,直接进入制作过程. 首先,需 ...

  4. 模块:(日期选择)jquery、bootstrap实现日期下拉选择+bootstrap jquery UI自带动画的日期选择器

    一:jquery.bootstrap实现日期下拉选择 点击文本框弹出窗口 弹窗显示日期时间选择下拉 年份取当前年份的前后各5年 天数随年份和月份的变化而变化 点击保存,文本框中显示选中的日期 代码部分 ...

  5. 用Jquery做一个时间日期选择器

    今天我们就用Jquery做一个时间日期选择器,当打开网页时,文本框里面显示的是当前的日期,点击文本框可以出现年.月.日的下拉菜单,并且可以选择,会根据年份的选择判断是否是闰年,从而改变二月的天数,闰年 ...

  6. bootstrap的日期插件datetimepicker有问题

    bootstrap的日期插件datetimepicker在chrome中会出现掉下来的现象,而且一直没找到原因,下载最新版的插件直接在各个浏览器中都会掉下来, 问题一直解决不了,转而换其他插件 htt ...

  7. 分享一下我封装iOS自定义控件的体会,附上三个好用的控件Demo <时间选择器&多行输入框&日期选择器>

    前段时间有小伙伴问到我:"这样的控件该怎么做呢?",我感觉是个比较简单的控件,可能对于入行不久的同志思路没有很清晰吧.趁着最近工作不忙,就来这里分享一下我封装自定义控件的几点体会吧 ...

  8. 日期选择器:jquery datepicker的使用

    helloweba.com 作者:月光光 时间:2012-04-08 21:05 标签: jquery  datepicker  jquery ui     在jquery ui中,提供了一个非常实用 ...

  9. Js日期选择器并自动加入到输入框中

    <html> <head> <title>Js日期选择器并自动加入到输入框中</title> <meta http-equiv="con ...

随机推荐

  1. 32 C++常见错误集锦

    1 下列程序中,K的值为:6 enum { a,b=5,c,d=4,e }k; K=c; 分析:enum中,首元素不赋值的话,默认为0:后一个元素不赋值的话比前一个元素大1. 2  程序运行正常. # ...

  2. 安装一个Linux

    Linux--虚拟机的的安装: 首先需要一个可执行(VMware-workstation-full-14.1.2-8497320.exe)的文件和一个Linux(CentOS-7-x86_64-DVD ...

  3. redis主从简单配置

    网上有好多复杂的配置,这里我用的是windows版的redis,简单配置了下,试验了下主从,能正常使用. 1.redis-master文件夹(里面是redis),redis-slave文件夹(里面是r ...

  4. hadoop 设置回收站

    我的问题是:hadoop回收站为什么会保留多个过期时间的数据   我们知道hadoop的回收站是在我们删除数据后能恢复的目录,但是我们并不希望在回收站保存太久的数据,我们可以使用如下参数进行配置.   ...

  5. be动词的形式和用法

    Be动词的形式: be, is, am, are, was, were, being, been 1.The man is back 2.They are back 3.He was back 4.T ...

  6. os、os.path模块(文件/目录方法)

    1.模块的概念:模块是一个包含所有定义的变量.函数的文件,模块可以被其余模块调用. 2.利用OS模块实现对系统文件的. os模块中常见的方法: gercwd()     返回当前工作目录 chdir( ...

  7. css 长用点

    功能 :     font-size: 0;        去除图片之间空白空隙

  8. rod cutting

    for a rod of length i the price of it si pi,to cut the rod to earn more money package dynamic_progra ...

  9. 记解决一次“HTTP Error 400. The request URL is invalid”的错误

    今天将图片服务切到使用了cdn的机器上面去,然后就部分图片报如下图错误“HTTP Error 400. The request URL is invalid” 看到这种错误信息,一般的开发者心中可能会 ...

  10. 剑指Offer 24. 二叉树中和为某一值的路径 (二叉树)

    题目描述 输入一颗二叉树的跟节点和一个整数,打印出二叉树中结点值的和为输入整数的所有路径.路径定义为从树的根结点开始往下一直到叶结点所经过的结点形成一条路径.(注意: 在返回值的list中,数组长度大 ...