jquery用户界面日期选择器时间控制冲突解决

由于公司项目发展迅速，很多事情没有整理好，所以潜在的问题很多。最近遇到了一个比较坑的问题。datepicker有两个插件库，datepicker插件很有名。一个是jQuery-UI，一个是bootstrap。这两个api网址是

然而不幸的是，这两个库都在项目中使用。然后发生了以下情况：http://jqueryui.com/datepicker/和http://引导数据库。readthedocs.io/en/latest/index.html.

平时不知道用哪个组件。

主要的问题是，如果你们两个成分相同，我就没有问题了。这两个组件在各种细节上完全不同。

这次的问题是我的日期选择器框被盖住了，如下图所示(上面的年份开关丢失了):

找了一下，发现渲染组件的时候自动加了z-index: 10，然后被上面固定的顶栏盖住了。然而，这种情况是没有必要的。每台电脑上的情况都不一样。在我看来，是谁的组件先加载导致的。(逻辑上，打包的项目按照index.html文件中引用的顺序排列，这应该是相同的调用顺序，但是在某些计算机上顺序会颠倒。有没有大神可以解答？)

因此，为了确定加载了哪一个，我编写了以下代码进行实验：

//初始化日期控制var $ buy=$(' input # ABC ')；var BuyDatePicker=$ BuyDate . DatePicker({ language : ' zh-CN '，format: 'yyyymm '，minViewMode: 'months '，autoclose: true，onSelect: function(){ console . log(' a ')；}，onClose:函数(){ console . log(' b ')；}});$buyDate.on('show '，function(){ $(. datepicker . datepicker-drop down . drop down-menu ')。css('z-index '，1000)；});大部分都是常见的，其中onSelect和onClose是jQuery-UI，show事件绑定在bootstrap上。

但是跑了一趟之后，我很惊讶，他们没有一个被处决，而且都没用。然后冷静下来仔细想一想。应该是这样的。

1.bootstrap的组件首先执行，然后再次呈现。

2.然后让jQuery-UI再次渲染，但是它没有覆盖前面的组件。

3.演出事件的绑定再次执行。但是这次是jQuery-UI重新渲染，无法读取监控事件，随意失败。

我估计在别人的电脑上，情况正好相反，他们先执行jQuery-UI的组件就可以了。

我没有发现其他人在网上写冲突。如果有人遇到，提供一个坑。以后避免踩坑。

以上就是本文的全部内容。希望对大家的学习有帮助，支持我们。