Bootstrap DateTimePicker (Eonasdan) 未显示

Question

我正在使用 Bootstrap v3 并且想使用 Eonasdan 的 DateTimePicker。我已经在其他项目中使用它没有问题。我现在的问题是单击输入框时 DateTimePicker 没有显示。输入框在那里，日期显示在输入框中。只是选择器没有弹出。这是我的代码：

HTML:

<div class="col-md-10" id="mSearchValueInput">
    <input id="mSearchValue" type="text" class="form-control date">
</div>

JavaScript:

<script type="text/javascript">
    $(function () {
        $('#mSearchValue').datetimepicker();
    });
</script>

库的顺序正确（我认为）并且它们处于原始状态：

<script src="/Scripts/jquery-3.1.0.js"></script>
<script src="/Scripts/moment.js"></script>
<script src="/Scripts/moment-with-locales.js"></script>
<script src="/Scripts/bootstrap.js"></script>
<script src="/Scripts/bootstrap-datetimepicker.js"></script>

CSS:

<link href="/Content/bootstrap.css" rel="stylesheet"/>
<link href="/Content/bootstrap-datetimepicker.css" rel="stylesheet"/>
<link href="/Content/site.css" rel="stylesheet"/>

不过，我不知道自己做错了什么。在我所有的其他项目中，它就是这样工作的。

也许这里有人有想法？

谢谢

Answer 1

正如@VincenzoC 在其中一条评论中所述，jQuery v3 和最新版本的 DateTimePicker (4.17.37) 目前存在问题。

他们 suggest using jquery-migrate-3.0.0.js, which I did not try. There is a pull request 通过编辑 bootstrap-datetimepicker.js.

中的 JavaScript 代码为我解决了这个问题

Answer 2

master 
<asp:ScriptReference Path="/Scripts/jquery-1.10.2.min.js"/>
<asp:ScriptReference Path="Scripts/jquery-1.10.2.js"/>            
<asp:ScriptReference Path="Scripts/jquery-1.10.2.min.map"/>
<asp:ScriptReference Path="/Scripts/bootstrap.min.js" />
<asp:ScriptReference Path="/Scripts/moment-with-locales.js"/> 
<asp:ScriptReference Path="Scripts/moment-with-locales.min.js"/>
<asp:ScriptReference Path ="/Scripts/bootstrap-datetimepicker.js"/>
<asp:ScriptReference Path ="Scripts/bootstrap-datetimepicker.min.js"/>
<asp:ScriptReference Path ="Scripts/respond.js"/>
<asp:ScriptReference Path ="Scripts/respond.min.js"/>

  <script type="text/javascript">
  function pageLoad() {
          //Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
    //Sys.WebForms.PageRequestManager.getInstance().beginAsyncPostBack();



    $(document).ready(function () {
        $('#<%=TbInDateTime.ClientID%>').datetimepicker(
        {

            format: "DD/MM/YYYY hh:mm:ss A"

        }
            );


    });

    $(document).ready(function () {
        $('#<%=TbOutDateTime.ClientID%>').datetimepicker(
           {
               format: "DD/MM/YYYY hh:mm:ss A"
           }
            );

    });

}

  <div style="position:relative; text-align:center;">&nbsp;

                 <asp:TextBox ID="TbInDateTime" runat="server" Width="200" EnableViewState="false"></asp:TextBox> 



    </div>

Bootstrap DateTimePicker (Eonasdan) 未显示

Bootstrap DateTimePicker (Eonasdan) not showing

javascript

css

twitter-bootstrap

datetimepicker

eonasdan-datetimepicker