在模糊上隐藏div

Question

我有一个jQuery函数,当单击一个元素时,隐藏的div显示.

$('.openHide').click(function(){
    $(this).next('.hiddenContent').toggle();
});

我需要修改它,我可以关闭这个div,如果我不仅仅点击第一个元素.可能在模糊,但我不知道如何表明元素......

$('.hiddenContent').blur(function() {
    $('.hiddenContent').parent().children('.hiddenContent').hide();
});

这是我的HTML:

<span class="openHide">text here</span>
<div style="display:none" class="hiddenContent">
     hidden content here
</div>

Answer 1

1. 在点击跨度时,应该切换div
2. 在身体上单击div应隐藏
3. 在单击div时,不应将事件传播到正文

4. 在点击跨度时,事件不应传播到正文

   $(document).ready(function() {    
      $('.openHide').click(function(e) {
           $('.hiddenContent').toggle();
           e.stopPropagation();
      });
   
      $(document.body).click(function() {
           $('.hiddenContent').hide();
      });
   
      $('.hiddenContent').click(function(e) {
           e.stopPropagation();
      });
   });