添加點擊功能到切換功能？

Question

我有一個可摺疊標籤的手風琴導航設置和切換+/-按鈕。

我想讓我的'標籤'DIV可點擊。我增加了以下功能圍繞我的代碼部分，除去repeditive切換（）函數，但它仍然沒有完全工作right--

修訂

$('.tabs').click(function() { 
    } 
) 

我的HTML

<div id="tab1" class="tabs">NEWS [<a href="#" class="button" id="plus1">more</a>]</div> 
<div class="expandable" id="one"> 
<p>This is placeholder text.</p></div> 

<div id="tab2" class="tabs">EVENTS [<a href="#" class="button" id="plus2">more</a>]</div> 
<div class="expandable" id="two"> 
<p>This is placeholder text.</p></div> 

我的javascript

$(window).load(function(){ 
$(document).ready(function(){ 

$(".expandable").hide(); 
$(".button").show(); 

$('.tabs').click(function() { // added new 

    $('.button').toggle(function(){ 
     $(".expandable").slideDown(
     function(){ 
      $(".button").text("less") 
     } 
    ); 
    },function(){ 
     $(".expandable").slideUp(
     function(){ 
      $(".button").text("more") 
     } 
    ); 
    }); 

}); // end of click 
}); 

}); 

我已經o每個選項卡都使用toggle（）函數進行設置，但我被告知不要那樣做。我與JS語法糾纏在一起，所以我不確定在這裏要去哪裏。

謝謝大家。

Answer 1

在你的情況下，不要創建多個togglefunction $('#plus1').toggle$('#plus2').toggle而分配類給他們，並創造一個$('.plus').toggle這將最大限度地減少和使你的代碼效率（維護）
有關如何用它去的更多信息，請參閱slide toggle example
它舉例說明了如何處理這個Toggle功能。你會對如何使用它有一個想法。與它的進展，如果有任何問題，然後做後期:)

修訂
指定一個類你的DIV需要被變成可點擊（比如tabs）
在您的JS編寫代碼

$(document).ready(function() { 
    $('.tabs').click(function() { 
     alert('the div is clicked'); 
     alert($(this).html()); // This is nothing but the content of clicked DIV 
    }); 
}); 

EDITED

$(document).ready(function() { 
    $('.expandable').hide(); 
}); 

或給予風格工作表

<style type="text/css"> 
.expandable { 
    display: none; 
} 
</style>