有没有办法从 javascript datepicker 输出长日期

Question

在此日期选择器中，从日历中选择日期后，所选日期以 dd-mm-yy 格式输出，有没有办法以长格式输出日期（2022 年 2 月 21 日星期一.) 这个日期选择器的来源是：https://code-boxx.com/simple-datepicker-pure-javascript-css/#sec-download

  // CHOOSE A DATE
  pick : (id, day) => {
    // (C1) GET MONTH YEAR
    let inst = picker.instances[id],
        month = inst.hMonth.value,
        year = inst.hYear.value;

    // FORMAT & SET SELECTED DAY (DD-MM-YYYY)
    if (+month<10) { month = "0" + month; }
    if (+day<10) { day = "0" + day; }
    inst.target.value = `${day}-${month}-${year}`;

   //  POPUP ONLY - CLOSE
  if (inst.container === undefined) {
    inst.hWrap.classList.remove("show");
  }
    // CALL ON PICK IF DEFINED
    if (inst.onpick) { inst.onpick(); }
  }
};

Answer 1

日期选择器的值将采用 yyyy-MM-dd 格式，您可以解析它（使用 String.split() 并将年月日传递给 Date() 构造函数。

然后我们可以使用Date.toLocaleString()输出正确的格式：

function dateChanged() {
    const dt = getDatePickerDate('date-input');
    const options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' };
    document.getElementById('output').innerHTML = dt.toLocaleDateString([], options);
}

function getDatePickerDate(elementId) {
    const value = document.getElementById(elementId).value
    const [year, month, day] = value.split('-');
    return new Date(year, month - 1, day);
}

<input id='date-input' type="date" value="2022-02-21" onchange='dateChanged()'>
<p id='output'></p>

有没有办法从 javascript datepicker 输出长日期

Is there a way to output the long date from javascript datapicker

html

javascript

date

datepicker