2017-10-13 1 views
0

Ich habe ein Problem mit einem clockpicker (http://weareoutman.github.io/clockpicker/).Clockpicker nicht Uhr Anzeige

Es verhält sich wie ein Textfeld, und es zeigt nicht die Uhr. Ich weiß nicht, was das Problem sein könnte, da ich die notwendigen Skripte und Stylesheets in der <head> des html enthalten:

<link href="http://weareoutman.github.io/clockpicker/dist/jquery-clockpicker.min.css" rel="stylesheet" /> 
<script src="http://weareoutman.github.io/clockpicker/dist/jquery-clockpicker.min.js"></script> 

I downladed auch das Vermögen, legte sie in das Projekt und importiert sie wie folgt aus:

<script th:src="@{/assets/js/plugins/clockpicker/clockpicker.js}" src="js/plugins/clockpicker/clockpicker.js"></script> 

Dies ist der hTML-Code, der die Textbox und das kleine Uhr-Symbol zeigt:

<div class="input-group clockpicker" style="width: 50%; float: left;"> 
    <input type="text" class="form-control" value=""> 
     <span class="input-group-addon"> 
      <span class="glyphicon glyphicon-time"></span> 
     </span> 
</div> 

und die jquery Aktivierung:

$('.clockpicker').clockpicker(); 

Ich habe absolut keine Ahnung, was zu tun ist, so dass jeder Rat willkommen ist. Danke im Voraus!

EDIT: Fiddle hier https://jsfiddle.net/q1skrndg/

+1

Können Sie Geige zur Verfügung stellen? –

+0

@artgb Es tut mir leid, wenn es nicht das, was man ist, nicht erwartet, habe ich es noch nie zuvor: https://jsfiddle.net/q1skrndg/ –

+1

Es ist mächtig clockpicker Beispiel hier http://jsfiddle.net/weareoutman/YkvK9/ –

Antwort

0

ich es gelöst wurde das Problem, das ich war Zugabe des clockpicker als ein jquery-Objekt, und die Aktivierung $('.clockpicker').clockpicker(); wurde gemacht, bevor das Element in der Seite ertrunken war, also war es nichts zu aktivieren. Ich denke, ich muss noch viel mit jquery arbeiten, um es vollständig zu verstehen. Vielen Dank an alle sowieso: D

2

Seine feine Arbeiten Ich glaube, Sie verpassten das Hinzufügen Jquery in Header

$('.clockpicker').clockpicker();
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
<script src="https://weareoutman.github.io/clockpicker/dist/jquery-clockpicker.min.js"></script> 
 
<link href="https://weareoutman.github.io/clockpicker/dist/jquery-clockpicker.min.css" rel="stylesheet"/> 
 
<div class="input-group clockpicker" style="width: 50%; float: left;"> 
 
    <input type="text" class="form-control" value=""> 
 
     <span class="input-group-addon"> 
 
      <span class="glyphicon glyphicon-time"></span> 
 
     </span> 
 
</div> 
 
<script> 
 
$('.clockpicker').clockpicker(); 
 
</script>

+0

I miss tat es hinzuzufügen, aber es war nicht das Hauptproblem, ich in einer Antwort zu verlängern. –

+0

'JQuery' ist für jedes jquery plugins von Drittanbietern erforderlich – Znaneswar