javascript - 在 Jquery 中隐藏除某个类的一个元素以外的所有元素

Question

我正在尝试创建一种效果，通过点击标题切换相应的内容 div。在显示某些内容时单击另一个标题应隐藏该内容 div 并显示与刚刚单击的标题对应的内容 div。

但是代码没有执行任何操作，正如您在以下 jquery 中看到的那样:http://jsfiddle.net/dPsrL/

有什么想法吗？

HTML:

    <div class="row title">
    <div class="title" industry_id="education">Ed</div>
    <div class="title" industry_id="tech">Tech</div>
    <div class="title" industry_id="finance">Fin</div>
</div>
<br>
<br>
<div class="row content">
    <div class="content" id="education">Education is great</div>
    <div class="content" id="tech">Technology is awesome</div>
    <div class="content" id="finance">Finance is super</div>
</div>

JavaScript:

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

('.title').on('click', function () {
    var clicked = $(this).attr('industry_id');
    alert(clicked);
    $("#"+clicked).toggle(400);
    $("#"+clicked).siblings().hide();
});

Answer 1

与其先切换被点击的元素然后隐藏其他元素，不如先隐藏所有内容然后显示被点击的元素？为您省去一张支票，您只需调换顺序即可

$('.title').on('click', function () {
    var clicked = $(this).attr('industry_id');
    alert(clicked);
    $('.content').hide();
    $('#' + clicked).show(400);
});