Thanks, Karl. Your suggestions work fine. I just started using
JQuery and found the selectors very powerful. I was wondering if the
selectors that you suggested can be less dependent on the number of
divs in that section of the HTML.
Instead of using "$(this).parent().parent().find(':checkbox')", is
there a way to select using the following rule:
Go up the hierarchy (regardless of how many parents there are) until
the first <a> is found, then give me a list of all the checkboxes that
are the descendants of the <div> right after the <a>.
Similarly, instead of using "$(this).parent().parent().prev()", is
there a way to select using the following rule:
Go up the hierarchy (regardless of how many parents there are) and
return the first <a>.
The reason that I asked these questions is because I can see myself
adding more <div>'s in that section of the HTML.
On Apr 15, 10:31 pm, Karl Swedberg <k...@englishrules.com> wrote:
> On Apr 15, 2009, at 6:24 PM, Dragon-Fly999 wrote:
>
>
>
>
>
> > Hi, I have a couple of questions about selectors. I have the
> > following HTML:
>
> > =====
>
> > Some <a> elements and <input> elements here.
> > ...
> > ...
>
> > <a id="info-1-heading">Information Type 1</a>
> > <div>
> > <div>
> > <input class="cat" id="first" type="checkbox"/><label
> > for="first">First</label>
> > </div>
> > <div>
> > <input class="cat" id="mid" type="checkbox"/><label
> > for="mid">Middle</label>
> > </div>
> > <div>
> > <input class="info1-cat" id="last" type="checkbox"/><label
> > for="last">Last</label>
> > </div>
> > </div>
>
> > ...
> > ...
> > More <a> elements and <input> elements here.
>
> > =====
>
> > Question 1:
> > In the click handler of the first checkbox, I would like to get the
> > first, middle, and last checkboxes (but not the other checkboxes on
> > the page). What selector should I use?
>
> There are a number of options, but this will do the trick:
>
> $(this).parent().parent().find(':checkbox')
>
> > Question 2:
> > In the click handler of the first checkbox, I would like to get the
> > first <a> element that it finds traversing up the hierarchy (i.e. the
> > <a> with id="info-1-heading"). What selector should I use?
>
> > Thank you.
>
> $(this).parent().parent().prev()
>
> or combined:
>
> $
> (this
> ).parent
> ().parent
> ().find(':checkbox').doSomething().end().prev().doSomethingElse();
>
> and a bit more readable:
>
> $(this)
> .parent()
> .parent()
> .find(':checkbox').doSomething()
> .end()
> .prev().doSomethingElse();
>
> --Karl
>
> ____________
> Karl Swedbergwww.englishrules.comwww.learningjquery.com
