Solved

Get Parent Element

Posted on 2008-06-19
7
18,787 Views
Last Modified: 2012-08-14
I have a situation where I would like to find the parent element of the current element, and I'd like to do so without cluttering up my code with an ID for every element that I need to find.

For instance, say I have the following:

<div>
  <a href="javascript: SomeFunction();">Link Text</a>
<div>

I want the function that is called to find the parent <div> element without giving the parent div and ID and without needing to give the <a> element an ID

I've tried passing "this" to the function, but that gets me no where.

What would I pass to the function and then how would I locate the parent div with that information.

If this isn't clear enough, please let me know an I will supply more information if I can.
0
Comment
Question by:Hube02
  • 3
  • 3
7 Comments
 
LVL 41

Accepted Solution

by:
HonorGod earned 400 total points
ID: 21827686
function SomeFunction( obj ) {
  var parent = obj.parentNode;
  ...

}

<a href="javascript: SomeFunction(this);">Link Text</a>
0
 
LVL 18

Author Comment

by:Hube02
ID: 21827840
This doesn't seem to work for links:

      function SomeFunction( obj ) {
        alert(obj);
        var parent = obj.parentNode;
        alert(parent);
      }

    <a href="javascript: SomeFunction(this);">Link Text</a>

The first alert shows "[object window]" the second "undefined"

But I'd already tested using (this) as I said.

It works if I change it to

      <span onclick="SomeFunction(this)">Link Text</span>

If this can't be done with a link <a href... then I can go to a different element type, but I was hoping to use a link to do this.

0
 
LVL 42

Assisted Solution

by:David S.
David S. earned 100 total points
ID: 21828648
Yeah, you can't use the "this" keyword to refer to a link when you use the href="javascript:SomeFunction()"

You don't have to not use a link though.

<a href="enable-js.html" onclick="SomeFunction(this)">Link Text</a>

Do you really want to use inline event handlers?
0
What Security Threats Are You Missing?

Enhance your security with threat intelligence from the web. Get trending threat insights on hackers, exploits, and suspicious IP addresses delivered to your inbox with our free Cyber Daily.

 
LVL 41

Expert Comment

by:HonorGod
ID: 21830255
Interesting.  I hadn't realized, or I forgot, that in this situation, the "this"
passed in that kind of call would be to the document.

One option would be to have a function executed when the page loads,
that looks for these kinds of links, and changes the onclick attribute to
provide the appropriate reference.

Does this sound like a viable option to you?

0
 
LVL 18

Author Comment

by:Hube02
ID: 21830463
I think I'm going to end up going with using a span and using CSS to make it look like a link. The reason that I wanted to avoid this is the fact that IE6 does not support the pseudo of hover on anything but a link and I don't really want to implement the htchover gizmo for just this.
0
 
LVL 41

Expert Comment

by:HonorGod
ID: 21831029
Well, thank you for sharing your decision with us.  This is one of the
reasons that I find experts-exchange so useful.

Thanks for the grade & points.

Good luck & have a great day
0
 
LVL 18

Author Comment

by:Hube02
ID: 21831297
I know that sometimes the answer is "No, that can't be done that way." And for me this is an acceptable answer. I find these answers just as useful as the ones that tell me how to do something, at least I know I need to head in another direction.

I appreciate the fact that I can just discuss a question with others rather than smacking my head on the monitor.
0

Featured Post

How your wiki can always stay up-to-date

Quip doubles as a “living” wiki and a project management tool that evolves with your organization. As you finish projects in Quip, the work remains, easily accessible to all team members, new and old.
- Increase transparency
- Onboard new hires faster
- Access from mobile/offline

Join & Write a Comment

Avoid defining the variables in the global scope; trying to define them in a local function scope. Because:   • Look-up is performed every time a variable is accessed.   • Variables are resolved backwards from most specific to least specific scope…
In Part 1 (http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/A_7849-Hex-Maze.html) we covered the hexagonal maze basics -- how the cells are represented in a JavaScript array and how the maze is displayed.  In this part, we'…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

760 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

20 Experts available now in Live!

Get 1:1 Help Now