Oh yeah, that too! :-D

--Karl

On Dec 4, 2009, at 1:41 PM, Rey Bango wrote:

Yep Karl's explanation was great. Also, you can leverage bind() to work with your own custom events in the case where you want to define something that needs to be triggered based on another action. Using the code from the docs, you can see what I'm talking about:

$("p").bind("myCustomEvent", function(e, myName, myValue){
 $(this).text(myName + ", hi there!");
 $("span").stop().css("opacity", 1)
              .text("myName = " + myName)
              .fadeIn(30).fadeOut(1000);
   });
$("button").click(function () {
     $("p").trigger("myCustomEvent", [ "John" ]);
   });

Rey...

Charlie Griefer wrote:
Hi Karl:
Awesome!  Got it :) Thanks for the explanation and examples.
Charlie
On Fri, Dec 4, 2009 at 9:01 AM, Karl Swedberg <k...@englishrules.com <mailto:k...@englishrules.com>> wrote: Hey Charlie, methods such as .click() and .mouseover() are just convenience
   methods. They all use .bind() internally. One nice thing about
   .bind() is that you can use multiple event types with it. For
   example, instead of doing this:
   $('a')
     .mouseover(function() {
       var $link = $(this);
       // do something with $link
     })
     .mouseout(function() {
       var $link = $(this);
       // do something with $link
     });
   You can combine them and avoid some repetition:
   $('a')
     .bind('mouseover mouseout', function(event) {
       var $link = $(this);
       if (event.type == 'mouseover') {
         // do something with $link on mouseover
       } else {
         // do something with $link on mouseout
       }
     });
   --Karl
   ____________
   Karl Swedberg
   www.englishrules.com <http://www.englishrules.com>
   www.learningjquery.com <http://www.learningjquery.com>
   On Dec 4, 2009, at 11:46 AM, Charlie Griefer wrote:
   Hi All:

   I've read over the docs, but don't quite understand what the
   bind() event provides versus just assigning a particular event
   handler to a selected element (or set of elements).

   For example, consider the code below.  What's the difference
   between the interaction with the <p> elements of class "first",
   and the <p> elements of class "second"?  Isn't the second bit
   effectively binding a click event handler to a specific batch of
   "p" elements just as the first one is?

Just not grokking it. Would appreciate if anybody could enlighten me.

   <script
src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/ jquery.js"></script>

   <script type="text/javascript">
       $(document).ready(function() {
           $('p.first').bind('click', function() {
               alert($(this).text());
           });

           $('p.second').click(function() {
               alert($(this).text());
           });
       });
   </script>

   <p class="first">A</p>
   <p class="first">B</p>
   <p class="first">C</p>
   <p class="first">D</p>
   <p class="first">E</p>

   <hr />

   <p class="second">F</p>
   <p class="second">G</p>
   <p class="second">H</p>
   <p class="second">I</p>
   <p class="second">J</p>

   --     Charlie Griefer
   http://charlie.griefer.com/

   I have failed as much as I have succeeded. But I love my life. I
   love my wife. And I wish you my kind of success.
--
Charlie Griefer
http://charlie.griefer.com/
I have failed as much as I have succeeded. But I love my life. I love my wife. And I wish you my kind of success.

Reply via email to