添加到 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

问题是您所做的只是为日期选择器和时间选择器创建标记和样式，您实际上并没有在输入上启用它们。

使用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/