javascript - rome.js 知道用户何时完成

Question

我正在使用rome.js对于日期选择器。当用户输入完日期后，我需要日期选择器消失并在页面上替换为显示日期的文本。问题是，我不确定如何判断用户何时完成选择日期。我真的不想为他们添加另一个控件来收起日期选择器，但想从用户的操作中推断出这一点。

我的一个想法是寻找 hide 事件 - 当与 autoHideOnClick 和 autoHideOnBlur 结合使用时，我想我可以告诉用户输入新日期并完成。但是，我发现，一旦创建选择器，我就会立即收到此事件 - 即使在创建选择器时输入元素具有焦点，选择器也不会立即弹出。此外，即使用户仍在输入日期，有时也会发生隐藏事件，例如，如果他们输入日期，然后仍想手动输入时间。

我在创建的输入元素上的 blur 事件遇到了类似的问题 - 例如，当选择器打开时它会触发。

我如何知道用户何时完成输入日期/时间？

Answer 1

我认为您可以向日期输入添加一个 keydown 事件处理程序，并在每次 keydown 敲击时验证日期，如果它有效，则将日期选择器(类名称为 rd-container)的显示属性更改为“none” ”。

这是伪代码。我验证了https://www.cssscript.com/demo/highly-customizable-date-and-time-picker-with-rome-js/

dateInput.onkeydown = function () {
   if(dateInput.text is valid) { //validate the date here.
     $(".rd-container").css("display","none");
   }
}

您可以使用相同的函数通过监听“onpaste”事件来检测用户是否将日期文本“粘贴”到您的输入元素中。

dateInput.onpaste = function () {
   if(dateInput.text is valid) { //validate the date here.
     $(".rd-container").css("display","none");
   }
}