Question

我想在点击按钮时选择一个特定的div ...唯一的问题是，它必须是buttonClicked的父div的div ...示例：

 <div class="container">
   <div class="box">
     <h2>Langtidsparkering</h2>
     <div class="content">
       Lorem ipsum dolor sit amet..
     </div>
   </div>
   <div class="listcontainer">
     <div class="list"> (THIS DIV SHOULD GET A CLASS "VISIBLE", WHEN THE BUTTON IS CLICKED)
     </div>
     <div class="listbar">
       <button class="viewPrices" type="submit" title="Open">Se priser<span></span </button>
      </div>
    </div>
  </div>

代码：

    $(".viewPrices").click(function () {
         $(".viewPrices").parents('.listaccordion .list').toggleClass('visible');
});

有什么建议吗？： - ）

Answer 1

这应该这样做。

.closest将通过父母直到找到匹配为止。然后，您可以.find找到您正在寻找的目标div。

$(".viewPrices").click(function () {
     $(this).closest('.listcontainer').find('.list').toggleClass('visible');
});

这是一个更新的小提琴：http://jsfiddle.net/n264v/2/

Answer 2

使用

$(this).parent().parent().children("div:eq(0)").toggleClass('visible');

这将选择按钮所在的父div的父div。

Answer 3

编辑你的JSFiddle：http://jsfiddle.net/n264v/3/

此外，以下代码也适用：

$(".viewPrices").click(function () {
         $(".viewPrices").parent().siblings('.list').toggleClass('visible');
});

对于这个HTML：

<div class="container">
   <div class="box">
     <h2>Langtidsparkering</h2>
     <div class="content">
       Lorem ipsum dolor sit amet..
     </div>
   </div>
   <div class="listcontainer">
     <div class="list"> (THIS DIV SHOULD GET A CLASS "VISIBLE", WHEN THE BUTTON IS CLICKED)
     </div>
     <div class="listbar">
       <button class="viewPrices" type="submit" title="Open">Se priser<span></span </button>
      </div>
    </div>
  </div>

自由添加以下css：

.list{
    display:none;
}
.visible{
    display:block !important;
}

JSFiddle for the above sample

Answer 4

尝试：

$(".viewPrices").click(function () {
     $(this).closest('div').prev('div').toggleClass('visible');
});

Answer 5

首先没有“listaccordion”类的div，所以你永远找不到匹配。

您可以使用：

$(".viewPrices").click(function () {
$(this).parent(".listbar").siblings(".list").toggleClass("visible");
}

jQuery - 在同一级别选择div

5 个答案: