oblur事件 兼容问题

Question

以下代码想捕捉到引起oblur事件的目标DOM元素。操作：先点击“原位置”使之获取焦点，再点击“点我”。程序获取“点我”的button节点。目前兼容IE和FF，请高手看下谷歌浏览器下如何获取onlur事件的属性～
<script language="javascript">
function blurEl(e){ var child=null;
if(window.event){
e=window.event;
child=document.elementFromPoint(
e.clientX + document.documentElement.scrollLeft, e.clientY
+ document.documentElement.scrollTop);
}else
child=e.explicitOriginalTarget;
document.getElementById('show').innerHTML="触发失去焦点的DOM为"+child.id;
}

</script><input value="原位置" onblur="blurEl(event)" /><button id="点我">点我</button>

Answer 1

  <script language="javascript">
function blurEl(e){
if(!e){var e=window.event}
var child=e.target||e.srcElement;
document.getElementById('show').innerHTML="触发失去焦点的DOM为"+child.id;}
</script><input value="原位置" onblur="blurEl(event)" id="starwrw"/> <button>点我 </button>
<div id=show></div>

Answer 2

1楼朋友，我需要获取到的是  触发该元素失去焦点的DOM，而不是该元素～

Answer 3

恩,试了下确实在chrome下不行,楼主其实分别在两个浏览器执行下面测试代码就知道为什么了<script language="javascript"> 
function blurEl(e){ var child=null; 
if(!event.target){ 
e=window.event ; 
child=document.elementFromPoint( 
e.clientX + document.documentElement.scrollLeft, e.clientY 
+ document.documentElement.scrollTop); 
alert("blurIE")
}else {
e.stopPropagation(); 
child=event.target; 
alert("blurChrome")
//child=event.explicitOriginalTarget
}
document.getElementById('show').innerHTML="触发失去焦点的DOM为"+child.id; 
} 
function asd(){
 alert("click")
}
</script> <input value="原位置" onblur="blurEl(event)" ID="Text1" NAME="Text1"/> <button id="点我" onclick=asd()>点我 </button>
<div id=show></div>

Answer 4

我的想法是,模拟IE的冒泡,让chrome下只在冒泡阶段执行,但是获得不到目标id
window.onload=function(){
var div=document.getElementById("Text1");
div=addEventListener("blur",blurEl,false)
}

Answer 5

楼上的说法我不太明白～
这么说chrome下获取不到这样的DOM元素？
没有做不到，只有想不到哈～高手都来看看哈～

Answer 6

在chrome,不管是冒泡阶段还是捕获阶段,onblur都比onclick先执行function click(){
 alert("click");
}
window.onload=function(){
var div=document.getElementById("Text1");
div.addEventListener("blur",blurEl,false);var div1=document.getElementById("xxx");
div1.addEventListener("click",click,false)
}

Answer 7

我这里主要达到的一个目的就是。当用户点击别处使“原位置”失去焦点后，我要判断这里的“别处”是不是我允许的DOM，只有不是我允许的DOM才做一些动作。所以，我需要获取到 触发该onlur的目标DOM。

Answer 8

也就是我并不在意那个onclick事件。  我想做的效果类似于 输入框的一个提示框。当用户在该提示框上点击时，虽然，输入框失去了焦点，但我并不消失该提示框。只有当用户点击到非该提示框的时候，判断触发失去元素的焦点非该提示框，才隐藏该提示框。

Answer 9

知道,但是chrome里explicitOriginalTarget 属性是无效的,
能想到的办法就是获得当前点到对象的target,如果点到对象的event能先捕获到,那移出以后event.target就能正确得到,如果explicitOriginalTarget 有效也不用这么麻烦了

Answer 10

那也就是要在body上添加一个onclick事件了～好像很BT的样子

Answer 11

如果是这样。在BODY上添加click事件，按你之前所说,onblur事件在click事件之前发，两个事件会会触发相反的结果，从而导致 提示框闪动。
按你的意思，应该是指用click事件，而不在加入onlur事件吧～

Answer 12

BeenZ  懂Chrome的JS调试吗？如果能调试一下，看到event的属性，也许有另外的解法～

Answer 13

今天弄你这个问题上班偷懒了很久，chrome的这个属性很恶心
还有，IE下你用document.activeElement就行了chrome虽然支持event.currentTarget  获得当前focus的对象，但是结果还是不正确，获得的始终是<input>框的对象，冒泡和捕获阶段同样无效..

Answer 14

呵呵，谢谢了，，不过问题最终还是没有从正道解决，Chrome下我用Windows.click兼容了一下，效果还好。只是当把它嵌在IFRAME以后，还是效果没达到预期～