Question

在下面的代码中，有没有办法将blurByClickOnLink设置为正确的值（在点击发生之前不使用鼠标悬停或其他指针事件来设置某些内容）？如果用户通过单击链接模糊文本框，则应该为true;如果用户通过Tab键或单击其他任何位置来模糊文本框，则应为false。谢谢你看看！

<html>
<body>
<input id="myInput" type="text" onblur="var blurredByClickOnLink='???'; console.log('input onblur. blurred by click on link = ' + blurredByClickOnLink);" />
<br/><br/>
<a id="myLink" href="javascript:console.log('a href');void(0);" onclick="console.log('a onclick');">Link</a>
</body>
</html>

Answer 1

当DOM上发生事件时，该事件本质上是“原子的”。这意味着事件将从事件队列中处理，然后才会处理下一个事件。这些事件不会以任何方式“分组”在一起。

当您的输入元素失去焦点时，会触发blur事件。此时，您现在可以询问有关blur的问题。但是，在其余环境中不会有任何其他状态变化。接下来发生的事情可能是点击link元素，这也可能导致事件触发。在这种情况下，链接上的单击事件。因为这些一个接一个地发生......首先是输入模糊，然后......稍后...点击链接，你无法知道模糊发生的时间，接下来发生的事情就是点击在链接上，因为它尚未发生。

一种可能的解决方案是在输入模糊上设置一个短计时器。这个计时器可能会触发另一个函数（比如说100毫秒）然后会问这个问题..链接被点击了吗？

这可能足以解决您的难题。

它帮助我思考这些问题的方法是可视化一个请求队列（一个收件箱），浏览器逐个处理以改变DOM的状态。问问自己“当我处理请求时，我是否有我需要做出决定的事情？”

onblur - 如何判断被点击的内容;或者如何判断onclick事件是否在等待运行

1 个答案: