datetimepicker不是函数jquery

Question

我使用datetimepicker jquery ui,当代码在html下面时,datetimepicker没有显示,当我用firebug console它检查时显示错误``

$("#example1").datetimepicker is not a function
[Break On This Error] $("#example1").datetimepicker(); 

以下是代码

<link href="css/styles.css" rel="stylesheet" type="text/css">
<link href="css/jquery-ui-1.8.16.custom.css" rel="stylesheet" type="text/css">

<style>
    .ui-timepicker-div .ui-widget-header { margin-bottom: 8px; }

    .ui-timepicker-div dl { text-align: left; }
    .ui-timepicker-div dl dt { height: 25px; margin-bottom: -25px; }
    .ui-timepicker-div dl dd { margin: 0 10px 10px 65px; }          
    .ui-timepicker-div td { font-size: 90%; }           
    .ui-tpicker-grid-label { background: none; border: none; margin: 0; padding: 0; }                   

</style>


<script type="text/javascript" src="scripts/jquery.js"></script>

<script type="text/javascript" src="scripts/jquery/ui/jquery.ui.datepicker.js"></script>
<script type="text/javascript" src="scripts/jquery/ui/jquery-ui-1.8.16.custom.min.js"></script>
<script type="text/javascript" src="scripts/jquery/ui/jquery-ui-timepicker-addon.js"></script>
<script type="text/javascript" src="scripts/jquery/ui/jquery-ui-sliderAccess.js"></script>

<script>
    $(document).ready(function(){
        $("#example1").datetimepicker();
    });
</script>

<script>

</script>

<input type="text" id="example1" class="hasDatePicker">

Answer 1

我在bootstrap datetimepicker扩展时遇到了同样的问题.包括datetimepicker.js之前的moment.js是解决方案.

Answer 2

请记住,jQuery UI的datepicker没有使用datetimepicker()进行初始化,这里似乎有一个插件/插件:http://trentrichardson.com/examples/timepicker/.

然而,只有jquery-ui它实际上被初始化为$("#example").datepicker().在这里查看jQuery的演示站点:http://jqueryui.com/demos/datepicker/

   $(document).ready(function(){
        $("#example1").datepicker();
    });

要在上面引用的链接上使用datetimepicker,您需要确保您的脚本路径对于插件是正确的.

Answer 3

由于某种原因,这个链接解决了我的问题...我不知道为什么...

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.13.0/moment.min.js"></script>

然后这个:

<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/js/bootstrap-datetimepicker.min.js"></script>

注意:我使用的是Bootstrap 3和Jquery 1.11.3

Answer 4

这完全是关于脚本的顺序.尝试重新排序它们,将jquery.datetimepicker.js放在所有脚本的最后!