锐客网

  1. 首页 > 睿知 > it技术 > >

如何更改Bootstrap Datetimepicker(by eonasdan)显示方向

IT知识前端后端bootstrap

使用(开源)第三方插件的优点是, 你无需重新发明轮子, 因为你可以找到有用的代码片段, 你可以将这些代码简单地添加到项目中并使用, 而无需你进行任何修改。 Bootstrap Datetimepicker是其中的一个插件, 如果你使用的是Bootstrap 3或4, 则可以轻松地将其嵌入应用程序中。但是, 此小部件最着名的问题之一是当你的项目已经有很多自定义类(可能不是你创建的, 而是其他人创建的)时的定位, 这使得代码更易于阅读和维护。如果出于某种原因在某些对话框中实现了选择器, 则选择器将不使用自动定向, 而是始终使用底部定向。
最简单的解决方案, 如果你不想弄乱更多的类或自定义插件的样式, 则可以使用widgetPositioning属性简单地强制datepicker的widget方向：

$('#your-input').datetimepicker({widgetPositioning:{horizontal: 'auto', vertical: 'bottom'}});

该属性接受具有2个属性的单个对象, 这些属性接受以下值：
  • 水平：“ 自动” , “ 左” , “ 右”
  • 垂直：” 自动” , “ 顶部” , “ 底部”
如果未指定, 则此属性的默认值为：
{horizontal: 'auto', vertical: 'auto'}

有关Datetimepicker的小部件定位属性的更多信息, 请在此处阅读文档。
【如何更改Bootstrap Datetimepicker(by eonasdan)显示方向】编码愉快！

    推荐阅读


    上一篇：如何解决Xampp MySQL错误＃2002-无法建立连接，因为目标计算机主动拒绝了它

    下一篇：Twig如何使用速记语法打印变量(如果存在)(不为空)