在 IE8 不显眼的 Javascript 中访问 event.target答案

【问题标题】：Access event.target in IE8 unobtrusive Javascript在 IE8 不显眼的 Javascript 中访问 event.target
【发布时间】：2010-04-15 01:09:25
【问题描述】：

以下函数在下拉菜单中获取目标元素：

function getTarget(evt){

 var targetElement = null;

 //if it is a standard browser
 if (typeof evt.target != 'undefined'){
  targetElement = evt.target;
 }
 //otherwise it is IE then adapt syntax 
 else{
  targetElement = evt.srcElement;
 }

 //return id of <li> element when hovering over <li> or <a>
 if (targetElement.nodeName.toLowerCase() == 'li'){
  return targetElement;
 }
 else if (targetElement.parentNode.nodeName.toLowerCase() == 'li'){

    return targetElement.parentNode;
 }
 else{
  return targetElement;
 }

不用说，它适用于 Firefox、Chrome、Safari 和 Opera，但不适用于 IE8（我猜在以前的版本中也是如此）。当我尝试使用 IE8 对其进行调试时，我收到错误“未找到成员”：

targetElement = evt.srcElement;

以及其他后续错误，但我认为这是关键。任何帮助将不胜感激。

抱歉，由于某种原因，格式不正确。

函数又来了

 function getTarget(evt){

var targetElement = null;

//if it is a standard browser get target
if (typeof evt.target != 'undefined'){
    targetElement = evt.target;
}
//otherwise it is IE then adapt syntax and get target
else{
    targetElement = evt.srcElement;
}

//return id of <li> element when hovering over <li> or <a>
if (targetElement.nodeName.toLowerCase() == 'li'){
    return targetElement;
}
else if (targetElement.parentNode.nodeName.toLowerCase() == 'li'){

            return targetElement.parentNode;
}
else{
    return targetElement;
}

}//结束getTarget

【问题讨论】：

是的，这是最简单的方法；）

标签： javascript events internet-explorer-8

【解决方案1】：

问题是在 IE 中，事件对象不是作为处理程序的参数发送的，它只是一个全局属性（window.event）：

function getTarget(evt){
 evt = evt || window.event; // get window.event if argument is falsy (in IE)

 // get srcElement if target is falsy (IE)
 var targetElement = evt.target || evt.srcElement;

 //return id of <li> element when hovering over <li> or <a>
 if (targetElement.nodeName.toLowerCase() == 'li'){
  return targetElement;
 }
 else if (targetElement.parentNode.nodeName.toLowerCase() == 'li'){

    return targetElement.parentNode;
 }
 else{
    return targetElement;
 }

【讨论】：

我其实是做 evt = evt ||窗口.事件；在调用函数之前，然后我将 evt 解析为 getTarget 函数...

【解决方案2】：

根据我的经验，您描述的问题与获取事件的位置（窗口或处理程序参数）无关，而是与事件是否“正确”引发有关。例如，如果您有一个文本输入元素，并且您调用它的 onchange 方法而不传入事件对象，则 event.srcElement 属性将为 null。

Jehiah 的以下代码很有用

function fireEvent(element,event){
   if (document.createEventObject){
      // dispatch for IE
      var evt = document.createEventObject();
      return element.fireEvent('on'+event,evt)
   }
   else{
      // dispatch for firefox + others
      var evt = document.createEvent("HTMLEvents");
      evt.initEvent(event, true, true ); // event type,bubbling,cancelable
      return !element.dispatchEvent(evt);
   }
}

调用示例：

fireEvent(element,'change');

【讨论】：

【解决方案3】：

见过的最短版本：

function getTarget(e) {
var evn = e || window.event;
return evn.srcElement || e.target;
}

【讨论】：

【解决方案4】：

我也遇到了这个问题。而问题是：在IE8中，事件必须是window.event，而不是params中声明的事件。

我固定如下：

    function onclick(event){
      if (is_ie8()){
        clicked_element = window.event.srcElement
      } else {
        clicked_element = event.target
      }
    }

【讨论】：