Specify jquery selector using variable

Question

I can't get $(target) to work.

If I click on a link with href=#top, alert(target) displays #top, but $(target).offset returns null.

$("[href^='#']").click( function() {
    var target = $(this).attr('href');
    alert(target);
    $("#body-wrapper").animate( {scrollTop: $(target).offset().top} ,300);
    return false
    })
};

I assume there's an element on your page <div id="top" /> and you're trying to retrieve the offset of that element? — hayesgm
– hayesgm, Commented Aug 10, 2011 at 0:55
Also, check out stackoverflow.com/questions/6993172/… for using data-elements instead of 'href'. The href-attribute should be reserved for true HTML hyperlink. — hayesgm
– hayesgm, Commented Aug 10, 2011 at 0:58

jfriend00 · Accepted Answer · 2011-08-10 01:06:53Z

2

When you do:

$(target).offset()

You're essentially doing:

$("#top").offset()

But, you apparently don't have an object in your page with an ID of "top" (thus why it returns null). So, this could work if you gave the link with the name of top that ID also like this:

<a name="top" id="top"></a>

Or, instead, you could use this jQuery to look for the link tag with name="top":

target = target.slice(1);               // remove # from start of the name
$("[name='" + target + "']").offset()   // construct $("[name='top']");

Here you look for a tag with an attribute of name='top'.

edited Aug 10, 2011 at 1:06

answered Aug 10, 2011 at 0:54

jfriend00

711k104 gold badges1.1k silver badges1k bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

hayesgm Over a year ago

Just to say, it's probably easier to ask questions in comments rather than blindly guess what the issue is..

Brandon Lebedev Over a year ago

@jfriend00 - WOW! I never thought of that--and that's it. Spot on.

Brandon Lebedev Over a year ago

@jfriend00 - Would that mean this post should be deleted since the question is irrelevant?

jfriend00 Over a year ago

@Alien Robert - I'm not sure what you think should be deleted. I was able to figure out what you were doing in your question (it took a few edits for me to get it right) and now you've got an answer. I don't think there's anything to delete here.

Brandon Lebedev Over a year ago

@jfriend00 - Fair. I'm still wondering if there's anyway to update the post so someone with my problem could find it in - but if they're as oblivious as I was, I guess that would defeat the purpose.

|

bfavaretto · Accepted Answer · 2011-08-10 00:53:20Z

0

Use $(this).offset(). Your target var is just a string, not a jQuery object or a DOM node.

answered Aug 10, 2011 at 0:53

bfavaretto

72k18 gold badges118 silver badges162 bronze badges

3 Comments

prodigitalson Over a year ago

he has target wrapped in $() so it should be the same as doing $('#top').

ShankarSangoli Over a year ago

The OP is not using target as a jquery object. He is doing $(target).

bfavaretto Over a year ago

In his code, target is a string ("#top"), and the post doesn't say he also has an HTML element with id="top". I assumed he was looking for the offset of the link itself.

ShankarSangoli · Accepted Answer · 2011-08-10 00:54:30Z

0

May be the element #top does not exist on the page. Try to alert $(target).length and see what you get.

answered Aug 10, 2011 at 0:54

ShankarSangoli

69.9k13 gold badges96 silver badges124 bronze badges

Collectives™ on Stack Overflow

Specify jquery selector using variable

3 Answers 3

6 Comments

3 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

6 Comments

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related