event.target accesso in IE8 unobstrusive Javascript

Question

La funzione seguente ottiene l'elemento di destinazione in un menu a discesa:

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; 
} 

Inutile dire, funziona in Firefox, Chrome, Safari e Opera, ma non lo fa in IE8 (e credo anche nelle versioni precedenti). Quando provo ad eseguire il debug con IE8 ottengo l'errore "Utente non trovato" sulla linea:

targetElement = evt.srcElement; 

insieme ad altri errori successivi, ma credo che questa è la linea chiave. Qualsiasi aiuto sarà apprezzato.

---

Siamo spiacenti, per qualche motivo la formattazione non è corretta.

Qui è la funzione di nuovo

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; 
} 

} // fine getTarget

Answer 1

Nella mia esperienza, il problema che si descrive non è correlato al punto in cui l'evento si ottiene (finestra o parametro handler), ma piuttosto a causa di se l'evento è stato sollevato o meno "correttamente". Ad esempio, se si dispone di un elemento di input di testo e si chiama il suo metodo onchange senza passare in un oggetto evento, la proprietà event.srcElement sarà null.

Il codice seguente da Jehiah è utile

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); 
    } 
} 

Esempio chiamata:

fireEvent(element,'change'); 

Answer 2

Il problema è che in IE, l'oggetto evento non viene inviato come argomento del gestore, è solo un globale proprietà (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; 
} 

Answer 3

Ho incontrato anche questo problema. E il problema è: in IE8, l'evento deve essere window.event, non l'evento dichiarato in params.

ho fissato come di seguito:

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

Answer 4

versione più breve mai visto:

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