You can take advantage of the index passed to each. What you posted is
very close to working:
$(function() {
var divs = $("div");
divs.each(function(i){
var prev = divs.eq(i-1).text();
var next = divs.eq(i+1).text();
alert(prev + " - " + next);
});
});
There's no need to check for the existance of a previous/next element,
as jQuery fails silently.
cheers,
- ricardo
On Feb 9, 5:25 pm, Stephan Veigl <stephan.ve...@gmail.com> wrote:
> Hi Adrian,
>
> as mkmanning already said, when you want to get the next / prev
> element from the same selector, simply access the array.
> In this case I prefer a for (var i=0; i<ps.length; i++) {...} loop
> instead of the $.each for performance reasons and readability, but
> that's personal taste.
>
> by(e) :-)
> Stephan
>
> 2009/2/9 mkmanning <michaell...@gmail.com>:
>
>
>
> > $("p") is an array, so you could just use the index:
>
> > var ps = $("p"); //cache
> > ps.each(function(i,d) {
> > var prevP = i>0?$(ps[i-1]):false; /* however you want to deal with
> > there not being a prev */
> > var nextP = i<ps.length-1?$(ps[i+1]):false; /* however you want to
> > deal with there not being a next */
> > if(prevP){
> > console.log($(prevP).html());
> > }
> > if(nextP){
> > console.log($(nextP).html());
> > }
> > //if you only want p's that have a prev AND next, you can do this
> > if(i>0 && i<ps.length-1){
> > console.log( $(ps[i-1]).html() + ', ' + $(ps[i+1]).html() );
> > }
> > });
>
> > On Feb 9, 8:55 am, Adrian Lynch <adely...@googlemail.com> wrote:
> >> This explains better what I'm after:
>
> >> $("p").each(function(i) {
> >> var prevP = $(this).parent().prev().children("p");
> >> var nextP = $(this).parent().next().children("p");
> >> console.info(prevP.html());
> >> console.info(nextP.html());
>
> >> });
>
> >> <div>
> >> <p>1</p>
> >> <div>
> >> <span>This is next</span>
> >> </div>
> >> </div>
> >> <div>
> >> <div>
> >> <span>This is previous</span>
> >> </div>
> >> <p>2</p>
> >> </div>
> >> <div>
> >> <p>3</p>
> >> </div>
>
> >> I want to refer to the next p in the each() loop but $(this).next()/
> >> prev() refers to the next sibling element in the DOM.
>
> >> So in the example above I'm having to go out to the parent, then get
> >> the next/previous, then come in to get the p I want.
>
> >> Now I'm wondering if there's a generic way to do this...
>
> >> By(e) <-----<< see!
> >> Adrian
>
> >> On Feb 9, 4:44 pm, Adrian Lynch <adely...@googlemail.com> wrote:
>
> >> > That's what I was hoping for, but next() and prev() act on the next
> >> > and previous elements in the DOM, not in the nodes you're looping
> >> > over. To demonstrate:
>
> >> > $("p").each(function(i) {
> >> > console.info($(this).next().html());
> >> > console.info($(this).prev().html());
>
> >> > });
>
> >> > <form action="test.cfm" method="post">
> >> > <div>
> >> > <p>1</p>
> >> > <div>
> >> > <p>This is next</p>
> >> > </div>
> >> > </div>
> >> > <div>
> >> > <div>
> >> > <p>This is previous</p>
> >> > </div>
> >> > <p>2</p>
> >> > </div>
> >> > <div>
> >> > <p>3</p>
> >> > </div>
> >> > </form>
>
> >> > Maybe I have to come out to the outer most divs before calling next()/
> >> > prev() on it.
>
> >> > Adrian
>
> >> > On Feb 4, 4:16 pm, Stephan Veigl <stephan.ve...@gmail.com> wrote:
>
> >> > > Hi,
>
> >> > > there are prev() and next() functions doing exactly what you need:
>
> >> > > $("div").each( function() {
> >> > > var prev = $(this).prev();
> >> > > var next = $(this).next();
> >> > > alert( prev.text() + "-" + next.text() );
>
> >> > > });
>
> >> > > (I've skipped the extra code for the first and last element for
> >> > > simplicity.)
>
> >> > > by(e)
> >> > > Stephan
>
> >> > > 2009/2/4AdrianLynch<adely...@googlemail.com>:
>
> >> > > > Hey all, I'm loop over some nodes witheach() and I need to look at
> >> > > > the next and previous elements for the current iteration.
>
> >> > > > <script type="text/javascript">
> >> > > > $(function() {
> >> > > > $("div").each(function(i) {
> >> > > > var prev = [SELECTOR FOR PREVIOUS DIV].text();
> >> > > > var next = [SELECTOR FOR NEXT DIV].text();
> >> > > > alert(prev + " : " + next);
> >> > > > });
> >> > > > });
> >> > > > </script>
>
> >> > > > <div>1</div>
> >> > > > <div>2</div>
> >> > > > <div>3</div>
>
> >> > > > Will I have to store a reference to the divs and access it with i in
> >> > > > the loop like this:
>
> >> > > > <script type="text/javascript">
> >> > > > $(function() {
>
> >> > > > var divs = $("div");
>
> >> > > > divs.each(function(i) {
>
> >> > > > var prev = "";
> >> > > > var next = "";
>
> >> > > > if (i > 0)
> >> > > > prev = $(divs.get(i - 1)).text();
>
> >> > > > if (i < divs.size() - 1)
> >> > > > next = $(divs.get(i + 1)).text();
>
> >> > > > alert(prev + " - " + next);
>
> >> > > > });
> >> > > > });
> >> > > > </script>
>
> >> > > > <div>1</div>
> >> > > > <span>Spanner in the works</span>
> >> > > > <div>2</div>
> >> > > > <span>Don't select me!</span>
> >> > > > <div>3</div>
>
> >> > > > Is next() the answer maybe?
