jQuery聯合功能

我有兩個類似的功能，我想合併，以便我可以在整個站點的任何地方使用。這是一個簡單的jQuery效果基本show /了slideDown效果與「隱藏」類和點擊發現DIV，它顯示和隱藏jQuery聯合功能

$('.clicker1').click(function(){ 

    // grab the hidden content 
    var desc = $(this).parent().find('.hidden'); 

    // remove toggle class and slide up 
    if ($(this).hasClass('toggled')) { 
     $(this).removeClass('toggled'); 
     $(desc).slideUp(400, 'linear'); 
    } 

    // add toggle class, slide down, and move the page up 
    else { 
     var loc = this; 

     $(desc).slideDown(400, 'linear', function() { 
     $.scrollTo($(loc).offset().top - 60, 400); 
     }); 

     $(this).addClass('toggled'); 
     $('.clicker1').not(this).removeClass('toggled'); 
     $('.hidden').not(desc).slideUp(400, 'linear');  
    } 
    }); 

$('.clicker2').click(function(){ 

    // grab the hidden content 
    var desc = $(this).parent().find('.hidden2'); 

    // remove toggle class and slide up 
    if ($(this).hasClass('toggled')) { 
     $(this).removeClass('toggled'); 
     $(desc).slideUp(400, 'linear'); 
    } 

    // add toggle class, slide down, and move the page up 
    else { 
     var loc = this; 

     $(desc).slideDown(400, 'linear', function() { 
     $.scrollTo($(loc).offset().top - 60, 400); 
     }); 

     $(this).addClass('toggled'); 
     $('.clicker2').not(this).removeClass('toggled'); 
     $('.hidden').not(desc).slideUp(400, 'linear');  
    } 
    });

我可以建立一個功能，把我自己的「clickerX」和「hiddenX」？

來源

2011-10-26 user906080

你有沒有想過使用jQuery切換http://api.jquery.com/toggle-event/ – scottheckel

它看起來像處理程序只是不同的類他們用作選擇器。最簡單的方法是編寫一個函數，根據類名生成一個點擊處理程序。請嘗試以下

var makeHandler = function(className, hiddenClassName,) { 

    return function() { 
    // grab the hidden content 
    var desc = $(this).parent().find(hiddenClassName); 

    // remove toggle class and slide up 
    if ($(this).hasClass('toggled')) { 
     $(this).removeClass('toggled'); 
     $(desc).slideUp(400, 'linear'); 
    } 

    // add toggle class, slide down, and move the page up 
    else { 
     var loc = this; 

     $(desc).slideDown(400, 'linear', function() { 
     $.scrollTo($(loc).offset().top - 60, 400); 
     }); 

     $(this).addClass('toggled'); 
     $(className).not(this).removeClass('toggled'); 
     $(hiddenClassName).not(desc).slideUp(400, 'linear');  
    }; 
}; 


$('.clicker1').click(makeHandler('.clicker1', '.hidden')); 
$('.clicker2').click(makeHandler('.clicker2', '.hidden2'));

來源

2011-10-26 20:15:24 JaredPar

絕對如此。你想寫一個插件。有很多關於製作jQuery插件的教程，但official docs提供了一個好的開始。

來源

2011-10-26 20:13:14

護理你爲什麼downvoted請發表評論的？ –

這是一條評論，而不是答案。你聽起來像是在說，「我們不會幫你，RTFM」，並希望得到積分。 – Blazemonger

問題是「我可以創建一個函數並放入我自己的'clickerX'和'hiddenX'嗎？」用jQuery做這件事的正確方法是編寫一個插件。這不是一個答案？我是否應該爲他編寫代碼？ –

jQuery聯合功能

回答

相關問題