单击关闭下拉框

Question

我有一个DIV，它会在单击时扩展，当前在单击另一个DIV时会关闭，但我也希望在单击时关闭，我的代码如下：

jQuery：

$(function(){
  $('.opReview').click(function(){
    $('.review').addClass('hide');
    $(this).children('.review').toggleClass('hide');
  });
});

HTML标记（可以忽略Wordpress代码）

<article class="sixteen columns opReview">          

 <img class="opLogo" src="<?php bloginfo('stylesheet_directory'); ?>/img/core/operator/90x58_operatorlogo/<?php echo $op_logo?>.png" alt="<?php echo($op_title)?>" >

  <div class="list_details">
    <div class="reviewTitle"><p>Click To </br> Read a review</p> </div>
  </div>

  <button class="claimBtn"><i class="fa fa-chevron-circle-right fa-rotate-90"></i></button> 
        <div class="clear"></div>

  <div class="review hide">
          <h1><?php echo $op_name; ?></h1>
            <p><?php echo $operator_review; ?></p>
        </div>
</article>

Answer 1

这段代码将隐藏所有.review元素，然后切换活动元素，将其取消隐藏

$('.review').addClass('hide');
$(this).children('.review').toggleClass('hide');

您需要从第一个选择器中排除当前项目

$(this).siblings('.review').addClass('hide');
$(this).children('.review').toggleClass('hide');