引導日期選擇器和timepicker當添加到WordPress主題

Question

真的希望你能幫助我這一個，我迷路了，不工作...

我添加bootstrap-datepicker.js和bootstrap-timepicker.js的主題的JS文件夾和相關的css文件到css/bootstrap文件夾中。

我修改的functions.php入隊的腳本和樣式：

wp_enqueue_script('bootstrap-js', get_template_directory_uri() .'/js/bootstrap.js'); 
wp_enqueue_script('bootstrap-datepicker', get_template_directory_uri() .'/js/bootstrap-datepicker.js'); 
wp_enqueue_script('bootstrap-fileupload', get_template_directory_uri() .'/js/bootstrap-fileupload.js'); 
wp_enqueue_script('bootstrap-timepicker', get_template_directory_uri() .'/js/bootstrap-timepicker.js'); 

wp_enqueue_style('bootstrap', get_template_directory_uri().'/css/bootstrap/bootstrap.css'); 
wp_enqueue_style('responsive', get_template_directory_uri().'/css/bootstrap/bootstrap-responsive.css'); 
wp_enqueue_style('bootstrap-datepicker', get_template_directory_uri().'/css/bootstrap/bootstrap-datepicker.css'); 
wp_enqueue_style('bootstrap-fileupload', get_template_directory_uri().'/css/bootstrap/bootstrap-fileupload.css'); 
wp_enqueue_style('bootstrap-timepicker', get_template_directory_uri().'/css/bootstrap/bootstrap-timepicker.css'); 

的對象正常顯示，但正在單擊時沒有任何反應。我用下面的HTML（從每個作者的網站示例代碼），美其名曰：

<div class="input-append date" id="datepicker" data-date="12-02-2012" data-date-format="dd-mm-yyyy"> 
    <input class="span2" size="16" type="text" value="12-02-2012"> 
    <span class="add-on"><i class="icon-th"></i></span> 
</div> 

<div class="input-append bootstrap-timepicker-component"> 
    <input type="text" class="timepicker-default input-small"> 
    <span class="add-on"> 
     <i class="icon-time"></i> 
    </span> 
</div> 

當我檢查在Chrome中的元素，我可以看到CSS是存在的，腳本是存在於資源>腳本部分。網站上的其他一切正常工作。

Answer 1

問題是你所做的一切都是爲datepicker和timepicker創建標記和樣式，但實際上並沒有在輸入上啓用它們。

使用jQuery你可以使用下面的javascript來實現：

$('.timepicker-default').timepicker(); // I would change the class, or maybe use an id 
$('#datepicker').datepicker(); 

你可以看到更多選項的文檔

• http://jdewit.github.com/bootstrap-timepicker/
• http://www.eyecon.ro/bootstrap-datepicker/