Javascript 日历未显示在引导datetimepicker中

我正在使用以下代码实现引导datetimepicker：

<div class="container">
    <div class="row">
        <div class="col-sm-6">
            <div class="form-group">
                <div class="input-group date" id="datetimepicker1">
                    <input type="text" class="form-control" />
                    <span class="input-group-addon">
                        <span class="glyphicon glyphicon-calendar"></span>
                    </span>
                </div>
            </div>
        </div>
    </div>
</div>

当我点击日历图标时，什么也没发生。我在执行中犯了什么错误

编辑：

---

添加了fiddler:

问题的原因是，您没有按正确的顺序放置参考脚本

请参阅文档：

$（'#datetimepicker1'）。datetimepicker（）
您可能还需要检查正在使用的图标集。
有多个字体图标集，如
font-Awesome
，
材质设计
，
引导字形图标
，等等

默认情况下，
DateTimePicker
使用
引导图示符图标
，但您可以为所有其他内容指定自定义图标

icons:{
            time: 'glyphicon glyphicon-time',
            date: 'glyphicon glyphicon-calendar',
            up: 'glyphicon glyphicon-chevron-up',
            down: 'glyphicon glyphicon-chevron-down',
            previous: 'glyphicon glyphicon-chevron-left',
            next: 'glyphicon glyphicon-chevron-right',
            today: 'glyphicon glyphicon-screenshot',
            clear: 'glyphicon glyphicon-trash',
            close: 'glyphicon glyphicon-remove'
        }

Ref-
至于文本框和日历图标之间混乱的间距，我可以通过注释行来修复：

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" />



我的项目替我处理这个问题。ASP.net/MVC
我还将col-sm-6更改为col-sm-12。
类似的问题，但解决方案不同
它特定于ASP.NET核心项目。在默认的visual studio模板中，
所有输入标签的最大宽度设置为280px，如下所示：

文件：site.css

只要删除它，日历图标就会放在正确的位置：）
我在使用jQuery 3.x时遇到问题。（最新版本的bootstrap3支持jquery3）。下拉列表将部分呈现，但没有日历。时间选择器部分工作正常

降级到jquery2.x修复了问题。
是否添加了引导日期选择器js文件？并添加引用？为人们提供一个工作示例（例如片段或提琴）真的很有帮助，因此我们很容易看到并解决您的问题。否则，我们将不得不设置整个环境，让库自己来确保我们的解决方案能够正常工作，而大多数人都不愿意花时间去做@ZohaibWaqar我已经添加了bootstrap-datetimepicker.min.js。运行你的应用程序，当页面加载时，按下f12并转到控制台，然后检查错误。然后点击日历，再次检查错误，让我知道//@ZohaibWaqar我没有看到任何操作中的错误（加载和点击），但仍然不起作用。谢谢Vimalan。我用你答案链接中的那个替换了我的引导datetime js和css，它成功了。现在我可以看到日历了。但我仍然发现选择器扭曲了，如我问题中的快照所示。你也能说说原因吗？@ATP，我无法重现这个问题。。。一个原因可能是，.form控件css可能会被其他css文件中的某个地方覆盖。。。如果你能更新反映问题的fiddler，那会很有帮助吗？即使我也不能在fiddler中复制。似乎是当地的一些制度问题。谢谢你的帮助。：）我从bower取的文件也有问题。有些东西在默默地失败。用你所拥有的替换了我的推荐信，现在可以使用了。谢谢。所以用jQuery3.x就没有希望了？我不得不升级jQuery以使用另一个库，这发生了…@mrrrk请检查一下您的css文件。我也面临同样的问题。对我来说，这是一种展示：没有。
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" />

/* Set widths on the form inputs since otherwise they're 100% wide */
input,
select,
textarea {
    max-width: 280px;
}