2015-12-02 173 views
1

我正在制作一个应用程序和使用自举timepicker,它只显示当前时间在我的输入字段但没有显示时间选择器来选择时间选择器 请帮我解决它。 也没有显示任何错误。bootstrap timepicker没有显示时间选择器选项

HTML

<div class="col-xs-3"> <label>Invoice #</label> 
    <input class="timepicker form-control " > 
</div> 

CSS

<!-- Bootstrap time Picker --> 
<link rel="stylesheet" href="plugins/timepicker/bootstrap-timepicker.min.css"> 

JS

<!-- bootstrap time picker --> 
<script src="plugins/timepicker/bootstrap-timepicker.min.js"></script> 

//Timepicker 
$(".timepicker").timepicker({ 
    showInputs: false 
}); 
+0

您能否创建/提供您遇到或粘贴整个html页面的问题的工作示例,以便我们可以看到您的所有代码?是SO代码片段还是jsfiddle?没有一个例子就很难调试它。在示例页面上,我看到他们使用ID而不是Class,你试过了吗? – Matthew

+0

先生我使用的ID,但仍然没有显示timepicker 当我加载页面它只显示当前时间..其意味着没有错误的代码,但仍然没有显示时间选择器来选择时间 – asif

+0

你包括jQuery的脚本因为我没有看到任何。加上你的JavaScript代码不在脚本标签内。在这里复制粘贴是否是错误的,或者实际上你没有包含这个错误? – marukobotto

回答

0

它似乎为我工作。

<link href="https://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css" rel="stylesheet" /> 
 
<link href="https://cdn.jsdelivr.net/bootstrap.timepicker/0.2.6/css/bootstrap-timepicker.min.css" rel="stylesheet" /> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script> 
 
<script src="https://code.jquery.com/jquery-1.9.1.js"></script> 
 
<script src="https://cdn.jsdelivr.net/bootstrap.timepicker/0.2.6/js/bootstrap-timepicker.min.js"></script> 
 

 

 
<div class="input-group bootstrap-timepicker timepicker"> 
 
    <input id="timepicker1" type="text" class="form-control input-small"> 
 
    <span class="input-group-addon"><i class="glyphicon glyphicon-time"></i></span> 
 
</div> 
 

 
<script type="text/javascript"> 
 
    $('#timepicker1').timepicker({ 
 
    showInputs: false 
 
    }); 
 
</script>

0

试着改变你的JS。

$('.timepicker').timepicker(); 
+0

仍然没有进展 – asif

+0

看看http://jdewit.github.io/bootstrap-timepicker/他们有一些有用的例子。 – Andy

+0

工作感谢您的回复 – asif

0

我添加bootstrap-timepicker类的父和它看起来像它使人们显示了我。