Bootstrap Timepicker不显示

我有一个模态窗口，我有一个表，用户可以选择时间。 在这个例子中，我能够让timepicker在表内工作。

$('.timepicker').timepicker().on('changeDate', function(ev){ $('.timepicker').timepicker('hide'); }); 

但是，在此示例中 ，时间选择器未显示。 没有例外被抛出。

Answer 1

为了将来参考，您可以在其css上编辑此部分：

 .bootstrap-timepicker-widget.dropdown-menu.open { display: inline-block; z-index: 10000; } 

Answer 2

我最终使用了一个jquery插件 ，该插件可以直接用于选择时间。

HTML

 Start End 

使用Javascript

 $('#mondayStartTime').timepicker(); $('#mondayEndTime').timepicker(); 

可通过CDN获得 。

它在modal dialog中运行良好。

这是一个例子：

http://jsfiddle.net/jkittell/C8w8v/126/

Answer 3

将此代码替换为bootstrap-timepicker.js文件中的第666行。 这对我有用。 这需要当前的模态z-index值并将其增加10 。

  var index_highest = 0; $(".modal").each(function() { // always use a radix when using parseInt var index_current = parseInt($(this).css("zIndex"), 10); if (index_current > index_highest) { index_highest = index_current; } }); var zIndex = parseInt(this.$element.parents().filter(function() { return $(this).css('z-index') !== 'auto'; }).first().css('z-index'), 10) + index_highest;