javascript - 使用 jQuery show()/hide()

Question

我在我的jsp页面中使用show()和hide()，它工作正常，但我无法找到隐藏我的方法表一旦显示。 HTML EX:

<button id="b1">show 1</button>
<button id="b2">show 2</button>
<div class="hidden" id="d1">
<div class="hidden" id="d2">

所以基本上我想在单击 button1 时显示 div1，并在单击 button2 时显示 div2 。我使用 hide()/show() 因为我不想两者同时显示。这是我的脚本:

  $('#b1').click(function(){
    $('#d1').show();
    $('#d2').hide();
  });

  $('#b2').click(function(){
    $('#d2').show();
    $('#d1').hide();
  });

所以这工作正常，就一次只显示一个而言，但我想向其中添加一些脚本，以便在显示 div2 时，我可以单击 Button2 并使 div2 隐藏，对于 div1 也是如此。我知道这很令人困惑，所以如果您有任何疑问，请询问。谢谢。

Answer 1

我想你想要这个:

$('#b1').click(function(){
    $('#d1').toggle();
});

$('#b2').click(function(){
    $('#d2').toggle();
});

如果您仍然需要使其只能显示一个，那么可能是这样的:

$('#b1').click(function(){
    if($('#d1').toggle().is(":visible")){
       $('#d2').hide();
    }
});

$('#b2').click(function(){
    if($('#d2').toggle().is(":visible")){
       $('#d1').hide();
    }
});