如何将 var/id 与类匹配

Question

我是 jquery 的新手，此外，我认为我的大脑冻结了。

我有许多具有不同 ID 的链接。我想将单击的链接与具有相应类的 div 相匹配，以便 div 将根据需要显示/隐藏/切换。

我有：

<script type="text/javascript">
$(document).ready(function() {
 $('.folioBox').hide();

 $('a.interface').click(function(){
        var currentId = $(this).attr('id');
        var currentBox = $('.folioBox .' + currentId);

        $(currentBox).toggle(400);

        });
});
</script>


<a class="interface" id="apple">Apple flavor</a>
<a class="interface" id="banana">Banana flavor</a>
<a class="interface" id="cherry">Cherry flavor</a>

<div class="folioBox apple">content</div>
<div class="folioBox banana">content</div>
<div class="folioBox cherry">content</div>

我只是无法让它工作，而且我不知道我是否最好使用匹配、查找或过滤。

一些帮助将不胜感激！

Answer 1

尝试：

$("a.interface").click(function() {
  $("div.followBox." + this.id).toggle(400);
  return false;
});

没有必要让它变得更复杂。如果有多个匹配项，那么它们都会被切换。

注意：我已使点击处理程序返回 false，以便停止跟踪链接。根据 href 属性中的内容，页面实际上可能会刷新，这解释了为什么它看起来不起作用。

Answer 2

现在只是看看它，但你是否尝试过在最后因为撞到锚点而返回 false ？

让我知道这是否有效，我将停止调试此端。

编辑

去掉两个类之间的空格。

var currentBox = $('.folioBox.' + currentId);