SitePoint Sponsor

User Tag List

Results 1 to 10 of 10
  1. #1
    SitePoint Member
    Join Date
    Aug 2011
    Posts
    5
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Accessing div area id value

    This is probably a ridiculously simple task, but I am new to Javascript, so here goes. Is it possible to get the 'id' (and other attributes) of a 'div' area after I have clicked into it?

  2. #2
    Non-Member
    Join Date
    Apr 2011
    Location
    no fixed address
    Posts
    851
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by blcoulter View Post
    Is it possible to get the 'id' (and other attributes) of a 'div' area after I have clicked into it?
    Yes , getElementById() will help you do what you want.

  3. #3
    SitePoint Member
    Join Date
    Aug 2011
    Posts
    5
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    But if I don't yet know the 'ID', how can I use the getElementById function?

  4. #4
    Non-Member
    Join Date
    Apr 2011
    Location
    no fixed address
    Posts
    851
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Then you can use the "this" keyword to refer to the object you clicked on. You can then access any property associated with that object.

    Code:
    this.someproperty

  5. #5
    One website at a time mmj's Avatar
    Join Date
    Feb 2001
    Location
    Melbourne Australia
    Posts
    6,282
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    In your click handling function, you should be able to access the object with

    evt.currentTarget
    or
    this

    Let's say you have this click handler

    Code:
      var clickhandler = function() {
        var id = this.id;
        // do stuff with the id
      };
    This is assuming you're using Jquery or some other Javascript framework which smooths out browser differences in the event handler.
    [mmj] My magic jigsaw
    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    The Bit Depth Blog Twitter Contact me
    Neon Javascript Framework Jokes Android stuff

  6. #6
    SitePoint Member
    Join Date
    Aug 2011
    Posts
    5
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks to both of you for the response. I'm making my changes right now.

  7. #7
    SitePoint Member
    Join Date
    Aug 2011
    Posts
    5
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The 'this' approach does not work; all I get is 'undefined' results. My browser is Safari. Does that make any difference?

  8. #8
    Non-Member
    Join Date
    Apr 2011
    Location
    no fixed address
    Posts
    851
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by blcoulter View Post
    The 'this' approach does not work; all I get is 'undefined' results.
    The "this" keyword works fine when used correctly, just like everything else.

    If you don't post your code I don't see how you expect anyone to help you figure out what you have done wrong.

  9. #9
    SitePoint Member
    Join Date
    Aug 2011
    Posts
    5
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    My HTML:

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
    <head>
    <title>Test ID value</title>
    <script type="text/javascript" src="drawpath.js" ></script>
    </head>
    <body id=BodyId bgcolor=white text=black onload="initvars('pLine1')" onclick=null ondblclick=null>
    <div class=vlane id=pLine1 style="left:1038; top:785; height:46" onclick="ProcessPath('pLine1')" ></div>



    My Javascript:


    function ProcessPath(Curr_Path_Id){
    var testid = this.id;
    alert ('testid = ' + testid);
    alert ('Curr_Path_Id = ' + Curr_Path_Id);

    function initvars(parm1){
    pathid = document.getElementById(parm1);
    pxpos = (pathid.style.left).indexOf( 'px' );
    Prev_Path_Left = parseInt((pathid.style.left).substr(0,pxpos));
    pxpos = (pathid.style.top).indexOf( 'px' );
    Prev_Path_Top = parseInt((pathid.style.top).substr(0,pxpos)) + 46;
    Curr_Path_Direction = 'N';
    }

  10. #10
    Non-Member
    Join Date
    Apr 2011
    Location
    no fixed address
    Posts
    851
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    you have mis-matched brackets


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
  •