Bootstrap datepicker无法正常工作

在我的webapp我使用引导组件;在我的一个页面中，我试图放置一个引导日期选择器，或者更好的日期选择器，但仍然没有运气。Bootstrap datepicker无法正常工作

我的CSS和JS进口（按顺序）：

bootstrap.css
datepicker.css
的jquery.js
bootstrap.js
引导，datepicker.js

我正在写的代码是：

<div class="container"> 
    <div class="row"> 
     <div class='col-sm-6'> 
      <div class="form-group"> 
       <div class='input-group date'> 
        <input data-format="dd/MM/yyyy hh:mm:ss" type='text' class="form-control" id='datetimepicker2' /> 
        <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span> 
        </span> 
       </div> 
      </div> 
     </div> 
     <script type="text/javascript"> 
     $(document).ready(function() { 
       $('#datetimepicker2').datetimepicker(); 
      }); 
     </script> 
    </div> 
</div>

但我试了很多脚本的组合（避免文档就绪函数调用，只是调用函数），在div和input上设置'datetimepicker2'id，总是没有运气。

当我尝试我的日期选择器没有任何反应，并在控制台中我总是得到：

遗漏的类型错误undefined是不就行了

错误的函数：

$('#datetimepicker2').datetimepicker();

我在网上搜索，我不是唯一有这个问题的人，很多人解决在div类中放入'日期'，但是没有做tr舔我。其他人也建议导入jQueryUI，但仍然没有运气。任何提示？

来源

2014-11-20 lateralus

您加载'自举datepicker.js'并试图用'的DateTimePicker '。是吗？ – 2014-11-20 18:22:19

看来你是缺少的moment.js ...工作小提琴：http://jsfiddle.net/0n2ok61a/ – Hackerman 2014-11-20 18:27:56

这肯定是其中一个问题，就好像我把datepicker它像一个魅力，但如果我导入datetimepicker.js并尝试调用datetimepicker它仍然不起作用。 @RobertRozas你是什么意思由moment.js？ – lateralus 2014-11-20 18:32:59

这似乎是一个jQuery的冲突。重新启动jquery版本并且需要jquery版本用于引导datepicker，或者您可能已经在html页面中导入了两个jquery版本。

来源

2014-11-20 18:28:06 jatin

我知道我为这个评论添加了一些内容，但答案并没有帮助我们直接解决问题。 – 2015-04-24 06:58:35

<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> 
 
    <script type="text/javascript"> 
 
     $(function() { 
 
     $('#datetimepicker1').datetimepicker(); 
 
     }); 
 
    </script> 
 
    </div> 
 
</div>

以上片段是我们所需要的，但只有1更需要被添加的行。这就是脚本标签。从上面复制div代码并从下面复制脚本部分。

$.noConflict(); 
 
$(function() { 
 
    $('#datetimepicker1').datetimepicker(); 
 
});

我希望这清楚地回答你的问题....

代码courtsey：http://eonasdan.github.io/bootstrap-datetimepicker/

来源

2015-04-24 07:05:20

Bootstrap datepicker无法正常工作

回答

相关问题