WordPress是否在Admin中提供Native Datepicker?

我正在开发一个插件,在管理员中我提供了一个由具有日期的用户填写的字段。 我想知道WP Admin I中是否有可用的原生日期选择器。

我通常会包含一个小的jQuery datepicker脚本来执行它,但如果一个已经可用,我会更喜欢这个明显的原因,如更轻的代码,UI一致性等。这似乎是应该/应该包括但我没有能够在管理员中找到有关jQuery内容(如果有)的文档。

已经给出了答案,但是我想扩展它以包括CSS(Wordpress不提供jQuery UI的样式表),以帮助任何人尝试使用这种脚本。

基本上(非常简单),您需要至少拥有以下三行代码:

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

逐行说明:

  1. 加载jQuery UI Datepicker(已经由Wordpress注册的库,没有其他必要)
  2. 使用句柄jquery-ui注册样式表(我使用Google托管的那个,你可以使用你喜欢的任何一个)
  3. 有效地将样式表包含在此页面中由Wordpress加载的样式表中

而现在你的Datepickers将是美好而多彩的! 🙂

HTML5礼物

这不是OP所要求的,但它与问题有些相关:如果你不想打扰添加Datepicker,你可以尝试HTML5日期输入,让浏览器创建一个非常好的(默认)日期选择器:

  

是的,不需要任何其他东西(它也适用于Wordpress的后端: https : //jsfiddle.net/2jxdvea0/

有关MDN的更多信息: https : //developer.mozilla.org/en-US/docs/Web/HTML/Element/input/date

注意正如@mark指出的那样,输入不适用于Firefox(以及其他浏览器)。 这在MDN页面中有说明,但当然也应该在这里提到。 当然,这个问题有解决方法,但写这些问题超出了这个问题的范围。

更新 03-11-2017截至@ kosso的评论,Firefox支持这一版本将在第57版中发布

是。 WordPress在核心中包含了这一点。 这里有几篇关于它的文章:

WP Codex:函数参考/ wp入队脚本

保罗安德伍德的虹膜颜色选择器教程 (相同的原则适用于datepicker)

添加以下代码行以从插件中排队jquery ui datepicker库:

 wp_enqueue_script('jquery-ui-datepicker'); 

您可以从jquery ui库网站​​下载样式表文件,并将其包含在您的插件中。 然后,您可以将CSS文件排入队列,如下所示:

 wp_enqueue_style('jquery-ui-css', 'http://www.example.com/your-plugin-path/css/jquery-ui.css'); 

或者,您可以包含来自Google的jquery ui CSS(如果您通过此路线,则无需使用插件发送CSS文件):

 wp_enqueue_style('jquery-ui-css', 'http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.2/themes/smoothness/jquery-ui.css'); 

将以下JQuery代码添加到您的javascript文件中,以便将datepicker附加到类为“custom_date”的任何字段:

  

现在,您只需将类“custom_date”添加到HTML代码中的日期字段,当用户点击该字段时,它将显示日期选择器日历。