添加点击功能到切换功能？

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>