jQuery自定義切換功能？

Question

我想做一個自定義的jQuery切換功能。現在，我有兩個單獨的功能，lightsOn和lightsOff。我怎樣才能組合這些功能，使他們切換（所以我可以鏈接到一個功能）？

function lightsOn(){ 
$('#dim').fadeOut(500,function() { 
    $("#dim").remove(); 
}); 
}; 

function lightsOff(){ 
$('body').append('<div id="dim"></div>'); 
$('#dim').fadeIn(250); 
}; 

Answer 1

function toggleLights() 
{ 
    var $dim = $('#dim'); 
    if ($dim.length) 
    { 
     $dim.fadeOut(500, function() 
     { 
      $dim.remove(); 
     }); 
    } 
    else 
    { 
     $dim = $('<div/>', {id: 'dim'}); 
     $('body').append($dim); 
     $dim.fadeIn(250); 
    } 
} 

演示：http://jsfiddle.net/mattball/hxL8s/

Answer 2

function toggleLights(){ 
    if ($("body").has("#dim")) { 
     $('#dim').fadeOut(500, function() { 
      $("#dim").remove(); 
     }); 
    } else { 
     $('body').append('<div id="dim"></div>'); 
     $('#dim').fadeIn(250); 
    } 
}