Question

我想在我的页面上有一个显示div的文本区域并隐藏其他区域（让我们说8个其他div）。点击，我想要显示所选的div和当前的div＆amp;其他div隐藏。有一个简单的解决方案吗？可以建立：show current clicked div hide previous clicked div？

Answer 1

这是一个使用链接方法的简单解决方案。

$("input").click(function () 
{
    $("#" + $(this).attr("class")).show().siblings('div').hide();
});

jsFiddle example（使用$（“输入”））
jsFiddle example（使用$（“。className”））

激活按钮可以与受影响的div的class具有相同的id，也可以使用单独的“toggler”类。

重要的是使用clicked元素的独特功能来映射到切换元素的独特功能。

最后，如果切换divs不是兄弟姐妹，您可以使用var divs = $("#blah1, #blah2, #blah3, ...");设置所有这些广告素材的选择器，并使用.not()进行切换。

jsFiddle example非同级切换divs使用.not()

Answer 2

这样的事情怎么样？

$(document).ready( function(){
  $('div.some_class').click( function(){ // set of divs to be clickable
    $(this).siblings('div').hide(); // it's already showing, right?
  });
});

当然，一旦点击其他人并隐藏其他人，你就无法将他们带回来......

Answer 3

它取决于DOM结构。我个人会给他们一些课程，以便轻松访问整个小组。 $('.div-group').hide(0, function(){$('#my-div').show();});

考虑使用jQuery UI Accordion，这可能是您需要的功能的答案。

jQuery在点击时显示div，隐藏其他人

3 个答案: