Solved

Get Parent Element

Posted on 2008-06-19
7
18,796 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
Networking for the Cloud Era

Join Microsoft and Riverbed for a discussion and demonstration of enhancements to SteelConnect:
-One-click orchestration and cloud connectivity in Azure environments
-Tight integration of SD-WAN and WAN optimization capabilities
-Scalability and resiliency equal to a data center

 
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

Free Tool: Subnet Calculator

The subnet calculator helps you design networks by taking an IP address and network mask and returning information such as network, broadcast address, and host range.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
jQuery Dialog Autoresize Bug 2 25
check a checkbox of a checkboxes group in bootstrap 2 46
Html input text color the frame line 2 22
Fix Form size HTML 16 15
In my daily work (mainly using ASP.net), I need to write a lot of JavaScript code. One of the most repetitive tasks I do are the jQuery Ajax calls. You know: (CODE) I don't know if for you it's the same, but for me is soooo tedious to write the …
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
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…

821 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