jquery - 仅在退出父元素后触发子事件

Question

我在父 div 中有两个子输入。一旦用户退出父元素，我想触发一个事件，但不是当用户从一个孩子直接移动到另一个孩子时。在此示例中，我要求用户在单独的输入中输入日期和时间：

<div id="form">
  <div id="dateTime">
    <input id="date">
    <input id="time">
  </div>
</div>

我尝试如下使用'.focusout'和'.blur'但没有成功 - 我的意思是当用户从“日期”到“时间”标签时触发事件，而不是等到用户标签“时间”之外" 并完全退出父 "dateTime" div。

$("#form").on('focusout', '#dateTime', function() {
  alert ('User has exited the "dateTime" div.');
});
$("#form").on('blur', '#dateTime', function() {
  alert ('User has exited the "dateTime" div.');
});

我在 HTML 结构中的方法或使用 JQuery 有问题吗？

Answer 1

我还没有尝试过，但我认为这应该可以

$("#dateTime").focusout(function() {
  if ($(this).has(document.activeElement).length === 0) {
    alert('User has exited the "dateTime" div.');
  }
});