Jquery 是否将单击功能添加到切换功能？

我有一个手风琴导航设置与可折叠的标签和切换+/-按钮

我正在尝试使我的“选项卡”分区可点击。我在部分代码中添加了以下函数，并删除了repeditive toggle（）函数，但它仍然不能正常工作--

已更新

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

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

我的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>

我最初为每个选项卡设置了一个toggle（）函数，但有人告诉我不要这样做。我很难理解JS语法，所以现在我不确定该往哪里走

---

谢谢大家。

在您的情况下，不要创建多个切换函数

$（''#plus1'）。切换
$（'#plus2'）。切换
而是为他们分配类并创建一个
$（'.plus'）。切换
这将最小化并使您的代码高效（可维护）

有关如何使用的更多信息，请参阅

它提供了一个关于如何处理这个切换函数的好例子。你会知道如何使用它。继续操作，如果有任何问题，请执行post:）

更新

为您的DIV分配一个需要可点击的类（比如
选项卡
）

在JS中编写以下代码

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

已编辑

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

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

或者给出一个样式表

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


.可扩展{
显示：无；
}
好的，我非常感谢你关于简化我的代码的建议。我一定会调查的，因为我以前没有做过你建议的事。但这并没有真正回答我最初的问题，那就是如何使DIVs可点击？我应该使用click（）吗？如何操作？好的，我放置了
$（'.tabs'）。单击（function（）{}）围绕我的代码，但我搞乱了一些东西。它同时加载扩展和[更多]显示。。然后它会重置，并且在我点击几次后，它似乎会按照预期的方式工作。。就像我说的，我认为我的问题在于语法…给它一个风格。默认情况下，样式应为
display:none我认为您应该更新您的问题，以便我了解您所做的更改。否则，接受这个答案，用你的新问题开始一个新问题，这样别人也会更好地回答