Jquery 基于单击事件隐藏同级分区

我有过类似的经历

<div id="divFirst"></div>
<div id="divSecond"></div>
<div id="divThid"></div>
<div id="Fourth"></div>

)

多谢各位。

---

Nizam

看起来您的选择器是错误的（假设按钮的名称只是

第一个

，

第二个

，等等）

尝试按如下方式更新代码：

$('#div'+selected).show('slow').siblings('div').hide('slow');

当然，您需要更新第四个

元素的ID，以包含

div

前缀字符串：

<div id="divFourth"></div>

另外，您的第三个

有一个打字错误（请参见

divThid

，应该是

divThird

）

---

这里有一个.

我建议您对这些div使用包装器div，并为所有div的click事件访问定义一个类，或者使用wrapper>子选择器

<script type="text/javascript">
$(function(){
    $('#wrapper > div').click(function(){
        $(this).show().siblings().toggle();
    });
});
</script>

$（函数（）{
$（'#wrapper>div'）。单击（函数（）{
$（this.show（）.sides（）.toggle（）；
});
});

试试这个：

HTML

<div id="buttons">
    <button name="divFirst">A</button>
    <button name="divSecond">B</button>
    <button name="divThird">C</button>
    <button name="divFourth">D</button>
</div>
<div id="divs">
    <div id="divFirst" class="hide">A</div>
    <div id="divSecond" class="hide">B</div>
    <div id="divThird" class="hide">C</div>
    <div id="divFourth" class="hide">D</div>
</div>

JQUERY

$('#buttons button').click(function(){
    var selected = $(this).attr('name');
    $('#divs div').attr({class:'hide'});
    $('#' + selected).attr({class:'show'});
});

---

发布..在消息中添加我在编辑答案，而你在评论：）不太可能。我只是懒得格式化那行代码。起诉我：P

$（'#div'+选中）。显示（'slow'）。兄弟姐妹（'div'）。隐藏（'slow'）
.hide{
    display:none;
}
.show{
    display:block;
}

$('#buttons button').click(function(){
    var selected = $(this).attr('name');
    $('#divs div').attr({class:'hide'});
    $('#' + selected).attr({class:'show'});
});