0

I have a function that targets the li elements of a div id called mk-featured-kits. All of this works perfectly. 

(function() {
    var myNode = document.getElementById('mk-featured-kits');
    myNode.addEventListener("mouseover", function(e) {
    console.log(e);
    if (e.target.tagName === 'LI') {
         // all happens here
    }
})();

I am using Chrome to see the console log and it allows me to use this path for the LI's: e.target.tagName.

Since IE 8 and bellow doesn't read addEventListener event, I am using this (code bellow) to check for the feature. The problem is by using this technique I can't access the LI using: e.target.tagName === 'LI' because the event only sees myNode as a tagName === DIV.

(function() {
var myNode = document.getElementById('mk-featured-kits');
if (myNode.addEventListener) {  // all browsers except IE before version 9
    myNode.addEventListener ("mouseover", function () {myEvent (myNode)}, false);
} else {
    if (myNode.attachEvent) {   // IE before version 9
myNode.attachEvent ("onmouseover", function () {myEvent (myNode)});
    }
}
function myEvent(myNode) {
    console.log(myNode);
    if (myNode.target.tagName === 'LI') {
    // all happens here
}
})();

How can I access the LI as I did on the first script but using the technique of the second script. Thank you in advance.

This is the html code: <div class="mk-column">

`<div id="mk-featured-kits">
  <ul>
    <li id="kit01"><a href="#">Link 01</a></li>
    <li id="kit02"><a href="#">Link 02</a></li>
    <li id="kit03"><a href="#">Link 03</a></li>
    <li id="kit04"><a href="#">Link 04</a></li>
    <li id="kit05"><a href="#">Link 05</a></li>
    <li id="kit06"><a href="#">Link 06</a></li>
    <li id="kit07"><a href="#">Link 07</a></li>
    <li id="kit08"><a href="#">Link 08 </a></li>
    </ul>
</div>`

`

Corvuslab
  • 31
  • 5
  • Shouldn't you be checking srcElement instead of target on IE? – bfavaretto Sep 03 '13 at 19:46
  • I suspect this is not working for you because `console.log` - which is in the callback - is actually not supported by IE8 (see [here](http://stackoverflow.com/questions/3326650/console-is-undefined-error-for-internet-explorer)). Try using a fallback for the console.log. – Suvi Vignarajah Sep 03 '13 at 19:55
  • Can you please your html too. Are you allowed to use jQuery? – Krasimir Sep 03 '13 at 19:58
  • I can't use jQuery nor Dojo. I am not worry at this point with IE no reading the console.log since I am testing only on Chome. If the path to my LI works on Chrome I will manage the rest on IE. – Corvuslab Sep 03 '13 at 20:12

0 Answers0