假设我在一个HTML输入框上附加了一个模糊函数，如下所示:
<input id="myInput" onblur="function() { ... }"></input>
是否有一种方法来获得导致模糊事件的元素的ID(被点击的元素)在函数内?如何?
例如，假设我有这样一个张成的空间:
<span id="mySpan">Hello World</span>
如果我在输入元素有焦点之后点击span，输入元素将失去它的焦点。该函数如何知道被单击的是mySpan ?
PS:如果跨度的onclick事件发生在输入元素的onblur事件之前，我的问题就解决了，因为我可以设置一些状态值，指示特定的元素已被单击。
PPS:这个问题的背景是，我想从外部触发一个AJAX自动补全控件(从一个可点击的元素)来显示它的建议，而不会因为输入元素上的模糊事件而立即消失建议。因此，我想检查是否有一个特定的元素被单击了模糊函数，如果是这样，忽略模糊事件。
当前回答
我写了一个替代方案如何使任何元素可聚焦和“模糊”。
它基于将一个元素设置为contentteditable，并在视觉上隐藏它，并禁用编辑模式本身:
el.addEventListener("keydown", function(e) {
e.preventDefault();
e.stopPropagation();
});
el.addEventListener("blur", cbBlur);
el.contentEditable = true;
DEMO
注:在Chrome, Firefox和Safari (OS X)中测试，对IE不确定。
相关:我正在寻找Vue的解决方案，所以对于那些感兴趣/好奇如何使用Vue Focusable指令实现这样的功能的人，请看看。
其他回答
我建议使用全局变量blurfrom和blurto。然后，配置您关心的所有元素，当它们失去焦点时，将它们在DOM中的位置分配给变量blurfrom。此外，配置它们，以便获得焦点将变量设置为它们在DOM中的位置。然后，您可以使用另一个函数来分析blurfrom和blurto数据。
2015答案:根据UI Events，你可以使用事件的relatedTarget属性:
用于标识与焦点相关的次要EventTarget 事件，这取决于事件的类型。
对于模糊事件，
relatedTarget:事件目标接收焦点。
例子:
函数blurListener(事件){ event.target.className = '模糊'; 如果(event.relatedTarget) event.relatedTarget.className = 'focused'; } [].forEach.call(document.querySelectorAll('input')， function(el) { 埃尔。addEventListener('blur'， blurListener, false); })； .模糊{背景:橙色} .集中{背景:lime} <p>模糊的元素将变成橙色 <p>聚焦的元素应该变成石灰 <input /><input /><input />
注意Firefox直到48版才支持relatedTarget (bug 962251, MDN)。
请记住，使用显式originaltarget的解决方案不适用于文本输入到文本输入的跳转。
试着用以下文本输入替换按钮，你会看到区别:
<input id="btn1" onblur="showBlur(event)" value="text1">
<input id="btn2" onblur="showBlur(event)" value="text2">
<input id="btn3" onblur="showBlur(event)" value="text3">
我不喜欢在编码javascript时使用超时，所以我会用与Michiel Borkent相反的方式来做。(没有尝试后面的代码，但你应该得到的想法)。
<input id="myInput" onblur="blured = this.id;"></input>
<span onfocus = "sortOfCallback(this.id)" id="mySpan">Hello World</span>
在大脑中就像这样
<head>
<script type="text/javascript">
function sortOfCallback(id){
bluredElement = document.getElementById(blured);
// Do whatever you want on the blured element with the id of the focus element
}
</script>
</head>
编辑: 一种简单的方法是创建一个变量来跟踪您关心的每个元素的焦点。如果你关心'myInput'失去焦点，为它设置一个变量。
<script type="text/javascript">
var lastFocusedElement;
</script>
<input id="myInput" onFocus="lastFocusedElement=this;" />
最初的回答: 你可以将“this”传递给函数。
<input id="myInput" onblur="function(this){
var theId = this.id; // will be 'myInput'
}" />
