Uncaught Error: datetimepicker component should be placed within a relative positioned container

本文主要是介绍Uncaught Error: datetimepicker component should be placed within a relative positioned container，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

在使用Bootstrap Datetimepicker时间选择控件时有的时候会出现下面异常：

Uncaught Error: datetimepicker component should be placed within a relative positioned container

这个异常的意思是datetimepicker指定的输入框的外层应该是一个相对定位的标签才可以。

异常情况下的代码：

<div class="form-group"><label class="control-label">日期1：</label><input class="form-control date validate[required,date[yyyy-MM-dd]]" name="stirng1" id="stirng1" placeholder="yyyy-MM-dd" />
</div>

//绑定日期控件
$('#stirng1').datetimepicker({format: 'YYYY-MM-DD',locale: moment.locale('zh-cn'),allowInputToggle: true
});

解决方案可以为input的父级添加position:relative

也可以使用bootstrap的input-group，如下：

<div class="form-group"><label class="control-label">日期1：</label><div class="input-group date"><input class="form-control  validate[required,date[yyyy-MM-dd]]" name="stirng1" id="stirng1" placeholder="yyyy-MM-dd" /><span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span></div>
</div>

js绑定同上。

更多使用实例：