Кнопки на bootstrap timepicker не отображаются

Question

Я использую таймер, но я не могу заставить кнопки показывать. Вот как выглядит timepicker.

Вот как я сделать это.

<input type="text" class="form-control timepicker appt_time" style="width:200px;"> 

<script> 
$('.timepicker').timepicker(); 
</script> 

Вот как я поставил их в своем заголовке

<link rel="stylesheet" media="screen" type="text/css" href="/content/css/bootstrap.css"> 
<link rel="stylesheet" media="screen" type="text/css" href="/content/css/bootstrap-datepicker.css"> 
<link rel="stylesheet" media="screen" type="text/css" href="/content/css/bootstrap-timepicker.css"> 

<script type="text/javascript" src="/content/script/jquery-2.0.3.min.js"></script> 
<script type="text/javascript" src="/content/script/bootstrap.min.js"></script> 
<script type="text/javascript" src="/content/script/bootstrap-datepicker.js"></script> 
<script type="text/javascript" src="/content/script/bootstrap-timepicker.js"></script> 

Я получил CSS файлы и файлы JS для timepicker Here.

Любые идеи, что вызывает это? Благодаря!

Answer 1

У вас есть файлы css и js, но вы пропустили захват глификонов.

Глификоны несут ответственность за отображение кнопок на таймере.

Если вы можете проверить свои инструменты разработчика на своих кнопках, вы можете увидеть, что изображения, кажется, отсутствуют.

Вот что я нашел на сайте, что вы выбрали timepicker

Включите glyphicons PNG-файл на вашем сайте, чтобы получить изображения отработаны.

Надеюсь, что это поможет

Answer 2

Try сценарий, как ...

<script type="text/javascript"> 
    $("input[id$='timepicker']").timepicker({ 
     minuteStep: 5, 
     showInputs: false, 
     disableFocus: true 
    });   
</script> 

Дайте идентификатор, скажем, идентификатор = "timpick" и в вызове, как $ ('# timpick') timepicker (варианты).