有條件地切換jQuery方法？

Question

我有一些文字，我想在一種情況下上下滑動，但在不同情況下淡入淡出。

目前，我這樣做：

var text1 = $('.text1'), 
    text2 = $('.text2'); 

if (conditionIsTrue){ 
    if (text1.is(':hidden')) { 
     text2.slideUp(); 
     text1.slideDown(); 

    } else if (text2.is(':hidden')) { 
     text1.slideUp(); 
     text2.slideDown(); 
    } 
} else { 
    if (text1.is(':hidden')) { 
     text2.fadeOut(); 
     text1.fadeIn(); 

    } else if (text2.is(':hidden')) { 
     text1.fadeOut(); 
     text2.fadeIn(); 
    } 
} 

有醜陋的代碼的重複在那裏雖然。有沒有辦法做到這一點沒有代碼重複？

Answer 1

我找到了一個很好的解決方案，以這種:)

var fadeSlideMethod = conditionIsTrue ? 'slide' : 'fade', 
     text1 = $('.text1'), 
     text2 = $('.text2');; 

    //lets you dynamically pick if you want to use jQueries slide or fade animation 
    $.fn.fadeOrSlide = function(method, inOrOut) { 
     var _this = this; 
     var functionality = { 
      slide : { 
       'in' : function(){ 
        _this.slideDown(); 
       }, 
       'out' : function(){ 
        _this.slideUp(); 
       } 
      }, 
      fade : { 
       'in' : function(){ 
        _this.fadeIn(); 
       }, 
       'out' : function(){ 
        _this.fadeOut(); 
       } 
      } 
     }; 
     functionality[method][inOrOut](); 
    } 

    if (text1.is(':hidden')) { 
     text2.fadeOrSlide(fadeSlideMethod,'out'); 
     text1.fadeOrSlide(fadeSlideMethod,'in'); 

    } else if (text2.is(':hidden')) { 
     text1.fadeOrSlide(fadeSlideMethod,'out'); 
     text2.fadeOrSlide(fadeSlideMethod,'in'); 
    }