300字范文,内容丰富有趣,生活中的好帮手!
300字范文 > bootstrap日期时间选择器datetimepicker 插件位置错乱解决

bootstrap日期时间选择器datetimepicker 插件位置错乱解决

时间:2018-10-21 21:03:14

相关推荐

bootstrap日期时间选择器datetimepicker 插件位置错乱解决

Date time picker下载

问题:该插件在浏览器中显示选择弹框候与表单位置错乱不对应

解决方案:

Bootstrap3/4与datatimepicker版本不兼容的问题导致

修改源码,找到bootstrap-datatimepicker.js 。

用你的编译器搜索找到这句话(我的是在634-636行,可能参数不一样,可搜索唯一关键词):

if (left + 220 > document.body.clientWidth) {left = document.body.clientWidth - 220;}

这样看起来就OK NO趴笨了

这是我的个人经验,可能不适配所有情况,如果问题不一样,可以百度/在下方留言。

关于汉化:

引入js

<!--中文--><script type="text/javascript" charset="UTF-8"src="{% static 'bootstrap-datetimepicker-master/js/locales/bootstrap-datetimepicker.zh-CN.js' %}"></script>

设置language:‘zh-CN’

其他问题:日期选择框左右箭头不显示(你们发现了吗?我的选择器没有左右翻转箭头)

如果用的是bootstrap3:

将datetimepicker.js 中的 icon-arrow-left,icon-arrow-right 改成glyphicon-arrow-left,glyphicon-arrow-right在input表单框中class类form-control

<input type="text" class="time-input form-control" id="BirTime" placeholder="出生日期" name="BirTime" >

反正我这么试不行,具体看版本,如果用的是bootstrap4,可以再装一个V3试试,我正在看…

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。