jQuery: The Write Less, Do More JavaScript Library

Re: JQuery events and a possible scoping error on my part?

by bsenftner :: Rate this Message:

Reply to Author | View in Thread


First off, I'd like to sincerely thank both olsch01 and charlie for  
their help, as well as the superb website of list member Karl  
Swedberg. Between their help and that web site, I have a completely  
generalized solution I am very happy with!

It was Karl's www.learningjquery.com site, and his article explaining  
"What is 'this'?" that gave me a complete grasp of what was going on.

So, now for any page that I want content to be available in sliding  
down and up sections, I do this:

1) any links for data to be revealed have the class "peekaboo"
2) each link for data to be revealed has an id of the form  
"reveal_someNumber", as in "reveal_1" and "reveal_3678"
3) each link for data to be hidden has an id of the form  
"hide_someNumber"
4) each block of content that gets revealed and hidden has an id of  
the form "peekaboo_someNumber"

And here's the jquery that makes the magic:

      // locate all page elements with the class "peekaboo":
      $(".peekaboo").each( function() {
                             // attach a click callback to our reveal-
link:
                             $(this).click( function() {
                                              var parts =  
this.id.split( "_" );
                                              $("#peekaboo_" + parts
[1]).slideDown();
                                              return false;
                                          });

                             // 'this' is an element of class  
'peekaboo',
                             // with an id holding key info:
                             var elems = this.id.split( "_" ); // id  
is of the form reveal_num

                             // attach a click callback to our hide-
link:
                             $("#hide_" + elems[1]).click( function() {
                                                                var  
parts = this.id.split( "_" );
                                                                $
("#peekaboo_" + parts[1]).slideUp();
                                                                 
return false;
                                                            });
                           } // close anonymous function each callback
                         );  // close 'each'


Sincerely,
-Blake
bsenftner@...

 « Return to Thread: JQuery events and a possible scoping error on my part?