For anyone who is wondering, "functino" is Italian for "tiny function."

Here's another way to write the code, using only a single event handler
(event delegation) instead of individual event handlers on every link. This
will be faster if there are a lot of product descriptions. I'd also put an
ID on the parent DIV - <div class="products" id="products"> - to make it
even faster:

    $('#products').click( function( event ) {
        var $target = $(event.target);
        if( $target.is('a.show-description') ) {
            $target.parent().next().show();
            return false;
        }
    });

-Mike

> From: Karl Swedberg
> 
> Hi Kris,
> 
> I'd give the "show description" links a common class -- for 
> example, "show-description"  That way you can use a basic 
> selector to apply to all of those links.
> 
> Then, I'd use the "this" keyword to find the appropriate 
> description relative to the clicked link.
> 
> Adding "return false" will prevent the link's default event 
> from being triggered.
> 
> So, given your markup, it might look like this:
> 
> $('a.show-description').click(functino() {
>       $(this).parent().next().show();
>       return false;
> });
> 
> 
> --Karl
> ____________
> Karl Swedberg
> www.englishrules.com
> www.learningjquery.com
> 
> 
> 
> 
> On Jul 4, 2008, at 10:36 AM, Kris wrote:
> 
> >
> > Whats the best way to provide functionality (eg. toggle an 
> 'additional 
> > information' div) when dealing with records with unique id's.
> >
> > For example lets say we are dealing with product records 
> each one has 
> > a unique id which is a number, so the HTML might look something like
> > this:
> >
> > <div class="products">
> >  <div class="product" id="product_1">
> >    <p>Name: Red Widget</p>
> >    <p>Price: 22.00</p>
> >    <p><a href="">Show description</a></p>
> >    <p id="description_1" style="display:none;">sadasdasdasdasd</p>
> >  </div>
> >
> >  <div class="product" id="product_2">
> >    <p>Name: Blue Widget</p>
> >    <p>Price: 24.00</p>
> >    <p><a href="">Show description</a></p>
> >    <p id="description_2" style="display:none;">sadasdasdasdasd</p>
> >  </div>
> >
> > etc. etc.
> > </div>
> >
> > I want to place unobtrusive jquery that will allow the 'show 
> > description' link to display the correct description div...
> >
> > Many thanks, K.
> >
> >
> 

Reply via email to