Vanilla JS Range Datepicker 有任何事件吗？

Question

我在我的项目中使用 Vanilla JS Range Datepicker 并且无法理解 - 是否真的可以将任何可用于 DataPicker 的事件用于 Range DataPicker？

我的任何尝试都会导致错误。

作为下面的示例代码。

const elem = document.getElementById('foo');
const rangepicker = new DateRangePicker(elem, {
  autohide: true
}); 

rangepicker.addEventListener('show', function (e, details) {
    console.log('some actions');
});

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vanillajs-datepicker@1.1.4/dist/css/datepicker.min.css">
<script src="https://cdn.jsdelivr.net/npm/vanillajs-datepicker@1.1.4/dist/js/datepicker-full.min.js"></script>



<div id="foo">
  <input type="text" name="start">
  <span>to</span>
  <input type="text" name="end">  
</div>

Answer 1

您应该为每个输入添加 changeDate 事件侦听器

const elem = document.getElementById('foo');
const rangepicker = new DateRangePicker(elem, {
  autohide: true
});

const startElem = document.getElementById('start');
const endElem = document.getElementById('end');

startElem.addEventListener('changeDate', function(e) {
  console.log('start', e.detail.date);
});

endElem.addEventListener('changeDate', function(e) {
  console.log('end', e.detail.date);
});

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vanillajs-datepicker@1.1.4/dist/css/datepicker.min.css">
<script src="https://cdn.jsdelivr.net/npm/vanillajs-datepicker@1.1.4/dist/js/datepicker-full.min.js"></script>



<div id="foo">
  <input type="text" name="start" id="start">
  <span>to</span>
  <input type="text" name="end" id="end">
</div>

Vanilla JS Range Datepicker 有任何事件吗？

There any Events for Vanilla JS Range Datepicker?

javascript

datepicker

daterangepicker