SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Addict
    Join Date
    Jan 2001
    Location
    Ottawa ON
    Posts
    315
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    DOM equivalent of window.event.srcElement;

    My page: http://members.home.net/prowsej does not work in Mozilla (specifically, K-Meleon)

    Apparently this is because my JavaScript code does nto conform to the DOM. How am I to change the following code to be compatible with Netscape (it always has and continues to work in IE). I have highlighted the two sections that I belive there will be an issue with. Thanks!

    <script type="text/javascript">
    function clickHandler() {
    var targetId, srcElement, targetElement;
    srcElement = window.event.srcElement;
    if (srcElement.className == "Outline") {
    targetId = srcElement.id + "details";
    targetElement = document.all(targetId);
    if (targetElement.style.display == "none") {
    targetElement.style.display = "";
    } else {
    targetElement.style.display = "none";
    }
    }
    }

    document.onclick = clickHandler;
    </script>

  2. #2
    JavaScript Guru (Big Ego) Arielladog's Avatar
    Join Date
    Jul 1999
    Location
    SC, USA
    Posts
    390
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hey prowsej,

    I didn't really look at your page, but from your code snippet, I think I know what you need. In DOM, the equivelent is event.target. But unlike IE's event.srcElement, it also returns text, so we can check to make sure it's not text that we're retrieving (if it is, then we take it's parent). Here's what you code should look like:

    Code:
    <script type="text/javascript"> 
    function clickHandler(e) { 
    var targetId, srcElement, targetElement;
    if(document.getElementById && !document.all){
    if(e.target.nodeName=="#text"){
    srcElement = e.target.parentNode;
    }else{
    srcElement = e.target;
    }
    }else if(document.all){
    srcElement = window.event.srcElement;
    }
    if (srcElement.className == "Outline") { 
    targetId = srcElement.id + "details"; 
    targetElement = (document.getElementById)?document.getElementById(targetID):document.all[targetId]; 
    if (targetElement.style.display == "none") { 
    targetElement.style.display = ""; 
    } else { 
    targetElement.style.display = "none"; 
    } 
    } 
    } 
    
    document.onclick = clickHandler; 
    </script>
    aDog

  3. #3
    You talkin to me? Anarchos's Avatar
    Join Date
    Oct 2000
    Location
    Austin, TX
    Posts
    1,438
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Of course that won't work for NS 4.x, check out http://www.dansteinman.com/dynduo for info on supporting IE and NS.

  4. #4
    JavaScript Guru (Big Ego) Arielladog's Avatar
    Join Date
    Jul 1999
    Location
    SC, USA
    Posts
    390
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hey,

    Anarchos is right about it not working for NN 4. I've written a proposed article on dHTML/DOM subject for sitepoint. Included in that article is this topic. However, I'll include the code I use for the tutorial for NN 4. Hopefully you can figure it out:

    Code:
                }else if(document.layers){
                      var mouseX = e.pageX, mouseY = e.pageY;
                      for (i=0;i<document.layers.length;i++){
                            el = document.layers[i];
    
    
                            if (mouseX>parseInt(el.left) && mouseX<parseInt(el.left+el.clip.width) && mouseY>parseInt(el.top) && mouseY<parseInt(el.top+el.clip.height)){
    
    
                                  layerID = document.layers[i].id.toString();
                                  break;
                            }
                      }
                }
    aDog

  5. #5
    SitePoint Addict
    Join Date
    Jan 2001
    Location
    Ottawa ON
    Posts
    315
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Arielladog, thanks for the code.

    Basically, if I want that code to work in both IE5 and Netscape6 you're saying that I have to include clumsy if/else statements for each browser? That's really clunky and there' got to be a better way to get the same code to work on both.

    Microsoft says that their JScript conforms to the standard. Of course Netscape's implementation will conform to the standard. Why can't I write the code once if they're both standards compliant?

    I also don't understand one part of your code - what am I supposed to pass through to the script, what is 'e' supposed to be? Since I'm calling the script whenever an onClick event occurs what am I supposed to include?
    Last edited by prowsej; Jun 7, 2001 at 23:16.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •