手机版

弹出对话框覆盖的引导数据库日期选择器的解决方案

时间:2021-08-21 来源:互联网 编辑:宝哥软件园 浏览:

当使用bootstrap的日期控件(datepicker,官方网站提供的名称是datetimepicker now)时,奶酪可能会遇到如上所示的问题。原因是什么?

它是由答案简单时输出的优先级引起的(z-index)

z-index的值越大,优先级越高,在上一张图片中显示的越多,即对话框的x-index的值大于datepicker的值

在上图中,找到对应控件的css样式后,修改x-index的值,直到对话框前显示datepicker的控件:

记住x-index的值(假设是1100),那么我们就可以解决这个问题!

有几种方法可以解决这个问题:

方法1:

找到bootstrap.css方法

查找下拉菜单

内容如下:

将x-index的值更改为1100(根据具体情况确定),保存并重新打开页面

如果没有,请F12查看优先级是否更改。

如果你出现如我上图,那么第一种方法不适合你!因为上图中的element.style{}是由

Js代码中,还可以看到图中两点的值被element.style覆盖

也别指望能通过!之所以修改“重要”的写法,是因为datepicker的窗口是js生成的,页面本身没有对应的标签(不过可以发现js文件在生成div后添加了这种样式,不过还是直接用第二种方法比较好)。

方法2:

找到datepicker的js文件。如前所述,这个公式是自动生成的,所以我们找到了bootstrap-datepicker.js(新版本名应该是bootstrap-datetimepicker.js)

修改生成样式的代码:

将z-index的值修改为1100(根据实际情况)

然后刷新页面看看。应该没问题。如果还有什么问题,请给我发一封私信。让我们一起学习~

摘要

以上是边肖介绍的引导数据库日期选择器被弹出对话框覆盖的解决方案。希望对大家有帮助。如果你有任何问题,请给我留言,边肖会及时回复你。非常感谢您对我们网站的支持!如果你觉得这篇文章对你有帮助,请转载,请注明出处,谢谢!

版权声明:弹出对话框覆盖的引导数据库日期选择器的解决方案是由宝哥软件园云端程序自动收集整理而来。如果本文侵犯了你的权益,请联系本站底部QQ或者邮箱删除。