时间戳

首页 > 解决方案 > bootstrap-datetimepicker-widget 未在弹出窗口中加载

javascript - bootstrap-datetimepicker-widget 未在弹出窗口中加载

问题描述

我正在尝试通过下载为与版本 4.17.47一起安装的“”来集成eonasdan 日期时间选择器，参考http://eonasdan.github.io/bootstrap-datetimepicker/bower install eonasdan-bootstrap-datetimepicker#latest --save

它在除模式弹出窗口之外的所有页面上都能完美运行。浏览器控制台上没有问题，当我点击输入框时bootstrap-datetimepicker-widget没有加载 -

以下是代码 -

Html : input type='text' class="form-control" id='datetimepicker8'

Script : $('#datetimepicker8').datetimepicker();

有什么建议么 ？

我正在使用所有必要的库，因为它在我的应用程序的其他页面上运行良好。

我已经尝试使用moment.js 2.18.1、moment-timezone 0.5.13、bootstrap 3.3.7、datetimepicker 4.7.47 使用jquery 3.2.1/3.3.1

我正在使用聚合物加载器来加载自定义 *.html 文件以及带有底层 nodejs 结构的 Bower 组件。

所有自定义的 html文件都封装<dom-module>了datetimepicker在datetimepicker输入框上，日历不显示。当bootstrap-datetimepicker-widget我从浏览器控制台检查时，它没有显示，但是该小部件完美地显示在我的应用程序的其他页面上。

我尝试在浏览器控制台上调试该datetimepicker()功能，并通过以下警报功能来了解返回的datetimepicker对象。

alert(JSON.stringify($('#datetimepicker8').datetimepicker(), null, 4));

在 datetimepicker 不工作的弹出窗口中的上述警报的结果与 datetimepicker 在我的应用程序中工作的地方的结果相同，它只是没有在弹出窗口上呈现 datetimepicker 日历。

我认为它是浏览器问题，因此尝试使用以下 Chrome 版本：版本 73.0.3683.86（官方版本）（32 位）版本 73.0.3683.86（官方版本）（64 位）版本 72.0.3626.81（官方版本）（64 -bit) 注意：我的应用程序主要为 chrome 开发，我们不支持其他浏览器。

删除我的 chrome 配置文件后，还尝试了隐身 Chrome 窗口。

我还尝试cdn js直接在弹出的 *.html 文件中包含调用，但在调试时我发现它是从应用程序 jspm 包和来自聚合物加载器的 datetimepicker 引用 nodejs 3.2.1，这是完全正确的。

HTML : input type='text' class="form-control" id='datetimepicker8'

Script : $('#datetimepicker8').datetimepicker();

上面的脚本调用被放置在一个就绪函数中。

预期结果：日期时间选择器应加载到输入框。实际结果：单击输入框 datetimepicker 不加载。

标签： javascriptpolymer

解决方案

谢谢 Udit、Mishu 和团队，您的回复给了我一个方向。以下是我应用的解决方案 -

datetimepicker 在作为单独窗口弹出的模态弹出窗口中未正确加载，因此我添加了以下 jquery 加载函数以使其工作。

$(function(){ $('#datetimepicker8').datetimepicker(); });

非常感谢。

推荐阅读