JQuery-UI-Datepicker的内置样式

时间：2013-01-27 作者：RRikesh

我想在网站前端使用与WordPress捆绑在一起的日期选择器。我排队了jquery-ui-datepicker 但是datepicker没有样式化（控制台中没有js错误）。是否有相应的wp_enqueue_style 为了这个？

我在中使用了此代码functions.php

function rr_scripts() {
  wp_enqueue_script( \'jquery\' );
  wp_enqueue_script( \'jquery-ui-datepicker\', array( \'jquery\' ) );

  wp_register_style( \'bootstrap_css\', get_template_directory_uri() . \'/assets/css/bootstrap.min.css\' );
  wp_enqueue_style( \'bootstrap_css\' ); # I\'m using Twitter Bootstrap as CSS(if it matters)
}
add_action( \'wp_enqueue_scripts\', \'rr_scripts\' );

2 个回复
最合适的回答,由SO网友:david.binda 整理而成

据我所知，datepicker没有风格。你必须自己注册。然后，代码将为：

function rr_scripts() {
  wp_enqueue_script( \'jquery\' );
  wp_enqueue_script( \'jquery-ui-datepicker\', array( \'jquery\' ) );

  wp_register_style( \'bootstrap_css\', get_template_directory_uri() . \'/assets/css/bootstrap.min.css\' );
  wp_enqueue_style( \'bootstrap_css\' ); // I\'m using Twitter Bootstrap as CSS(if it matters)

  wp_register_style(\'jquery-ui\', \'http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css\');
  wp_enqueue_style( \'jquery-ui\' );   
}

add_action( \'wp_enqueue_scripts\', \'rr_scripts\' );

SO网友:csehasib

To load script & style, add the following code to your theme\'s functions.php file. 

function add_e2_date_picker(){
//jQuery UI date picker file
wp_enqueue_script(\'jquery-ui-datepicker\');
//jQuery UI theme css file
wp_enqueue_style(\'e2b-admin-ui-css\',\'http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.0/themes/base/jquery-ui.css\',false,"1.9.0",false);
}
add_action(\'wp_enqueue_scripts\', \'add_e2_date_picker\');

Script for back-end use:

function add_e2_date_picker(){
//jQuery UI date picker file
wp_enqueue_script(\'jquery-ui-datepicker\');
//jQuery UI theme css file
wp_enqueue_style(\'e2b-admin-ui-css\',\'http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.0/themes/base/jquery-ui.css\',false,"1.9.0",false);
}
add_action(\'admin_enqueue_scripts\', \'add_e2_date_picker\');
我必须加入options-general.php 显示在设置->日期选择器上。只需将此代码再次放入函数中。前面代码下面的php文件。

function register_datepiker_submenu() {
    add_submenu_page( \'options-general.php\', \'Date Picker\', \'Date Picker\', \'manage_options\', \'date-picker\', \'datepiker_submenu_callback\' );
}

function datepiker_submenu_callback() { ?>

    <div class="wrap">

    <input type="text" class="datepicker" name="datepicker" value=""/>

    </div>

    <script>
    jQuery(function() {
        jQuery( ".datepicker" ).datepicker({
            dateFormat : "dd-mm-yy"
        });
    });
    </script> 

<?php }
add_action(\'admin_menu\', \'register_datepiker_submenu\');

?>
请查看更多详细信息Add a jQuery Date Picker to WordPress Theme or Plugin

结束
标签： css   wp-enqueue-style   jquery-ui   datepicker   小码农  

相关推荐

3.5媒体管理器将css/js添加到新的‘Tab’iFrame内容

在（耐心地）等待新媒体上传器的正确文档和/或一些教程的同时，我仍在使用media_upload_tabs筛选以向上载程序添加选项卡。这是我的（工作）代码：<?php add_filter( \'media_upload_tabs\', \'olab_add_media_tab\' ); function olab_add_media_tab( $tabs ) { $tabs[\'bildarkiv\'] = __( \'Bildarkiv\', \'bild