Question

This feels like a really basic question…that I cant find the answer for! Just a basic jQuery click function:

$('button.one').click(function () {
    var selectorVal = 'one';
    $('div#one').slideDown('slow');
    $('div#two').slideUp('fast');
    return selectorVal;
}

How do I retrieve and output selectorVal outside the function? Thanks so much!

Answer 1

You have two options:

1. Define variable outside the callback:

   var selectorVal;
   $('button.one').click(function (){
       selectorVal = 'one';
       $('div#one').slideDown('slow');
       $('div#two').slideUp('fast');
   });
   // somewhere here check for selectorVal value (if any)
   

2. (better) Use another callback:

   var doSomethingWithSelectorVal = function(selectorVal){
       // here do something with updated selectorVal value
   };
   $('button.one').click(function (){
       selectorVal = 'one';
       $('div#one').slideDown('slow');
       $('div#two').slideUp('fast');
       doSomethingWithSelectorVal(selectorVal);
   });
   

As I mentioned above, the second option is the better option, as using callback in this case is best suited.