Question

我需要一个div来隐藏和展示。默认情况下，必须隐藏div。如果有人点击其他特定的div / link（但不是按钮），则会显示该隐藏的div。我想用jQuery做。以下是示例代码：

<div class="yes"></div> 
<div class="no"></div> 
<p class="notUnderstand"></p>

<div class="proceedContent"></div>

场景：

“proceedContent”div默认隐藏为
如果有人点击div“是”，将显示“proceedContent”div 如果“proceedContent”div被隐藏了
如果有人点击div“no”“proceedContent”div将被隐藏如果“proceedContent”div可见
如果有人点击div“notUnderstand”“proceedContent”div将会如果“proceedContent”div可见，则隐藏

我如何使用jQuery做到这一点？

Answer 1

请看这个小提琴：

http://jsfiddle.net/jFIT/T4X8n/

您可以将点击事件添加到任何元素，如小提琴中所示。

$('.yes').click(function() {
    $('.proceedContent').show();
});

$('.no, .notUnderstand').click(function() {
    $('.proceedContent').hide();
});

Answer 2

$('.yes').click(function() {
    $('.proceedContent').show();
})

$('.no, .notUnderstand').click(function() {
    $('.proceedContent').hide();
})

JSFIDDLE

Answer 3

<script type="text/javascript">
  if ($) {
    $(document).on("click", "#divYes", function ($e) {
      $('#proceedContent).show();
    });
    $(document).on("click", "#divNo", function ($e) {
      $('#proceedContent).hide();
    });
    $(document).on("click", "#notUnderstand", function ($e) {
      $('#proceedContent).hide();
    });
  }
</script>

<div id="divYes"></div> 
<div id="divNo"></div> 

<p id="notUnderstand"></p>

<div id="proceedContent" style="display: none;"></div>

Answer 4

您可以使用 jquery not()选择器：

$('.yes').click(function() {
    $('.proceedContent').show();
});

$('div').not('.yes').click(function() {
    $('.proceedContent').hide();
});

Answer 5

我认为这可能是你正在寻找的东西。使用jQuery＆＃39; .show()和.hide()这是可能的。这是我创建的小提琴的链接。

jsfiddle

Answer 6

这样：

$('.yes').click(function() {
    $('.proceedContent').show();
});

$('.no, .notUnderstand').click(function() {
    $('.proceedContent').hide();
});

如何通过使用jQuery单击其他div来隐藏和显示div

6 个答案: