您的位置:首页 > Web前端 > BootStrap

bootstrap-datetimepicker的使用方法和兼容问题

2016-09-11 16:34 489 查看
jinja2模版的{%block head%}中引入js文件
<script type="text/javascript" src="/static/JS/jquery-2.1.4.min.js"></script><script type="text/javascript" src="/static/JS/bootstrap.min.js"></script><!-- bootstrap日期选择器 --><script type="text/javascript" src="/static/JS/datetimepicker.min.js" charset="UTF-8"></script><link rel="stylesheet" type="text/css" media="screen" href="/static/CSS/bootstrap-datetimepicker.min.css"><script type="text/javascript" src="/static/JS/locales/bootstrap-datetimepicker.zh-CN.js" charset="UTF-8"></script>
</pre><pre name="code" class="javascript">绑定表单,class="form-control <span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255); "><strong>datetimepicker</strong></span><span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255);">"</span>
{{ internform.start(required='', value=internship.start,class="form-control datetimepicker") }}
在{%block script%}中设置datetimepicker控件的相关参数
    <!-- bootstrap日期选择器 --><script type="text/javascript">$('.datetimepicker').datetimepicker({format: 'yyyy-mm-dd',language: 'zh-CN',pickDate: true,inputMask: true,autoclose: true,todayBtn: 'linked',todayHighlight: true,minView: "month"});</script>
兼容问题:在chrome中没有发现错误,而在firefox和ie中会显示不出来用firefox的插件firebug控制台可看到有一个错误:TypeError: (intermediate value).toString(...).split(...)[1] is undefined把插件bootstrap-datetimepicker.min.js里的this.defaultTimeZone=(new Date).toString().split("(")[1].slice(0,-1);改为this.defaultTimeZone='GMT '+(new Date()).getTimezoneOffset()/60;并把bootstrap-datetimepicker.min.js重命名datetimepicker.min.js或其他js名称,即可解决。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  bootstrap