Forums

kaffekop

Hello.

I'm trying to get hold of the prev/next-objects when clicking a link from within the #menu.
I've tried all sorts of .prev(), .prevUntil() a.s.o but so far I haven't had any luck with it :)

My current layout is:

<div id="menu">
<table>
<tr>
<td>
	 <h3>A h3 tag here</h3>
	 <ul>
	 	 <li><a href="page1">page1</a></li>
	 	 <li><a href="page2">page2</a></li>
	 </ul>
</td>
<td>
	 <ul>
	 	 <li><a href="page3">page3</a></li>
	 </ul>
</td>
</tr>
</table>
</div>
<div id="prev">prev page container</div>
<div id="next">next page container</div>

jquery:

$('#menu a').click(function(){
	 // get the parent.a object so i can send send it to the #prev container as <a href="pageX">pageX</a>
	 // get the next.a object so i can send it to the #next container as <a href="pageX">pageX</a>
});

If possible the script should ignore the table,tr,td,ul & li items, the menu structur/html can change in the future (its can be user-configured) - if not, no worries :)

noahgelman

$('#menu a').click(function(){
    var theLink = $(this).parent().siblings().children('a').attr('href');
    // do whatever you want with the theLink variable
});

kaffekop

Kinda like that yes, except that it only gets the data in the same td.
Firebug says:

clicked: page1 > prev = page2
clicked: page2 > prev = page1
clicked: page3 > prev = undefined
with:
$('#menu a').click(function(){
    $prev = $(this).parent().siblings().children('a').attr('href');
    console.log( "clicked: " + $(this).attr('href') + " > prev = " + $prev );
    return false;
});

The idea is that clicking "page2" will set "prev" = "page1" and "next" = "page3", clicking "page1" will set "next" to "page2" and "prev" to null, and so on.

I managed to make a "hey it works" version yesterday that runs a $('#menu a').each and then sets the $prev and $next, but it feels a bit clumsy and php'ish.

treehouse : what would you like to learn today?

Forums

jquery - get prev and next href.