5
$('.myElem').live('click', function() {
    $(this).hide(500, function() {
        $(this).siblings('.myOtherElem').show();
    });
});

The above doesn't work because $(this) is no longer in correct scope in the callback. How do I pass my original source element into the callback?

fearofawhackplanet
  • 52,166
  • 53
  • 160
  • 253

3 Answers3

7

Actually your code should work.

To access this within an inner javascript method you might store the reference in the outer method scope:

$('.myElem').on('click', function() {

   var myElem = this;    
    $(this).hide(500, function() {
        $(myElem).siblings('.myOtherElem').show();
    });

});

However in most jQuery methods this is referring to the selector or element used:

$('.myElem').on('click', function() {
    // This refers to the clicked element
    $(this).hide(500, function() {
       // This refers to the clicked element as well 
       $(this).siblings('.myOtherElem').show();
    });    
});
jantimon
  • 36,840
  • 23
  • 122
  • 185
2
$('.myElem').live('click', function() { 
    var $this = $(this);
    $this.hide(500, function() { 
        $this.siblings('.myOtherElem').show(); 
    }); 
});
John Hartsock
  • 85,422
  • 23
  • 131
  • 146
0
$('.myElem').live('click', function() {
    $(this).hide(500);
    $(this).siblings('.myOtherElem').show();
});
mcandre
  • 22,868
  • 20
  • 88
  • 147
  • That won't accomplish the same thing. Putting the `.show()` call in the callback ensures that it won't happen until the `.hide()` animation is completed. The code in your answer will cause them to both happen nearly simultaneously. – Daniel Schaffer Jul 07 '10 at 13:38
  • You could do it by using `delay`: `.delay(500).show(1)` However using the `show` callback is the better solution. – jantimon Jul 07 '10 at 13:42