Javascript 如果新的焦点元素不是子元素，则jQuery模糊

我有一个

blur

事件附加到一个容器（在本例中是一个表格单元格），其中包含一个或多个可单击的项目（例如输入字段和按钮）

有两件事会发生在我的手机里。如果某个输入字段中的值发生更改，则会处理该表单。如果某个值未更改，但焦点丢失，则窗体将被清除

如果用户单击了单元格中的另一项，我不希望单元格模糊

下面是我尝试过的一件事-检查

blur

事件中聚焦儿童的数量

HTML 但不幸的是，集中儿童的长度总是报告为0

然后我试着

$('body').not('#edit, #edit > *').on('focus', function () {
    alert('The user has clicked something else');
});

但这根本不起作用！我也对此表示怀疑，因为我要求在

焦点

处理程序之前启动

更改

处理程序，这样，如果用户进行了更改，表单就不会被取消

---

这里有一个适合懒惰孩子的JSFIDLE:

一个可能的解决方案是使用基于计时器的方法

$('table').on('blur', '#edit', function () {
    var timer = setTimeout(function(){
        console.log('The user has clicked away from the form');
    }, 20);
    $(this).closest('td').data('blurTimer', timer)
}).on('focus', '#edit', function () {
    clearTimeout($(this).closest('td').data('blurTimer'))
});

演示：

---

注意：在调试时，首选控制台日志记录而不是警报

一种可能的解决方案是使用基于计时器的方法

$('table').on('blur', '#edit', function () {
    var timer = setTimeout(function(){
        console.log('The user has clicked away from the form');
    }, 20);
    $(this).closest('td').data('blurTimer', timer)
}).on('focus', '#edit', function () {
    clearTimeout($(this).closest('td').data('blurTimer'))
});

演示：

---

注意：在调试时，首选控制台日志记录而不是警报

问题在于事件的顺序-仅在从上一个元素触发

blur

事件后设置目标元素的焦点问题在于事件的顺序-仅在从上一个元素触发

blur

事件后设置目标元素的焦点上一个元素这在Google Chrome v29上不起作用-此外，我不喜欢超时，因为如果用户的浏览器太慢，它会变得易怒。这在Google Chrome v29上不起作用-此外，我不喜欢超时，因为如果用户的浏览器太慢，它会变得易怒

$('table').on('blur', '#edit', function () {
    var timer = setTimeout(function(){
        console.log('The user has clicked away from the form');
    }, 20);
    $(this).closest('td').data('blurTimer', timer)
}).on('focus', '#edit', function () {
    clearTimeout($(this).closest('td').data('blurTimer'))
});