我正在使用 LightPick 日历。
它工作正常，但我需要实现的功能是在同一页面上制作两个日历并将它们链接在一起。我想要他们两个内联日历。我只想在该日历中选择范围。例如，我想在任一日历中选择一个范围，第二个日历也应该更新其值。
目前我在一页上有两个日历，我试图将它们链接在一起
//HTML文件
<div class="card">
<div class="card-body">
<div class="row">
<div class="col-md-5">
<p id="cal-result-2"> </p>
<input type="text" id="calendar-2" class="form-control form-control-sm" style="display: none;"/>
</div>
</div>
</div>
</div>
</div>
<p class="lead">Calendar 3 - Select Range</p>
<div class="card">
<div class="card-body">
<div class="row">
<div class="col-md-5">
<p id="cal-result-3"> </p>
<input type="text" id="calendar-3" class="form-control form-control-sm" style="display: none;"/>
</div>
</div>
</div>
</div>
</div>
// JS File
// calendar-2
new Lightpick({
field: document.getElementById('calendar-2'),
inline: true,
singleDate: false,
selectForward: true,
onSelect: function(start, end){
document.getElementById('cal-result-3').innerHTML = rangeText(start, end);
document.getElementById('cal-result-2').innerHTML = rangeText(start, end);
}
});
// calendar-3
new Lightpick({
field: document.getElementById('calendar-3'),
inline: true,
singleDate: false,
selectForward: true,
onSelect: function(start, end){
document.getElementById('cal-result-2').innerHTML = rangeText(start, end);
document.getElementById('cal-result-3').innerHTML = rangeText(start, end);
}
});
但他们正在更新文本 html 中的值，而不是实时内联日历中的值。我需要帮助来链接这些日历。
我需要帮助来链接这些日历。
