时间戳

首页 > 解决方案 > 从 bootstrap-datepicker 获取日期并单独打印

javascript - 从 bootstrap-datepicker 获取日期并单独打印

问题描述

我正在使用引导日期选择器。我想获取日期值（20-Sep-19）并将其打印在三个不同的 div 中（这样我就可以设置不同的样式）。

<div class="input-group date">
  <input type="hidden" id="date-input" value="20-Sep-19" class="form-control">
  <div id="div1">20 </div>
  <div id="div2">Sep'19</div>
  <div id="div3">Wednesday</div>
</div>

$(function(){
  $('.input-group.date').datepicker({
  format: 'dd-M-yy',
  todayHighlight: true,
  autoclose: true});
});

我已经尝试了一些 jquery 但不起作用。

$(document).on("change", "#date-input", function () {
  var date = new Date($('#date-input').val());
  day = date.getDate();
  month = date.getMonth() + 1;
  year = date.getFullYear();
  alert([day, month, year].join('/'));

});

任何人都知道如何实现这一点。提前致谢。

标签： javascriptjquerybootstrap-datepicker

解决方案

查看此小提琴以快速实施。

您的 Javascript 将需要解析从元素dateChange事件发回的数据datepicker

picker.on("changeDate", function(e) {
        div1.text(e.date.getDate());

        var month = getMonthName(e.date.getMonth());
        var year = ("" + e.date.getYear()).substr(1, 3);
                div2.text(month + " '" + year);

        div3.text(getDayOfWeek(e.date.getDay()));
    });

getMonthNameandgetDayOfWeek函数只接受一个整数并返回相应的月/日。

从事物的声音来看，您对 Javascript 还是比较陌生。我强烈建议您完全了解如何使用 Javascript 和 jQuery。请参阅以下资源以获取更多信息：
* JS 日期和实用程序
* jQuery .text()
* Bootstrap-datepicker changeDate 文档

推荐阅读