Question

我想为每个＆＃34; .ImHere＆＃34;找到父母最近的按钮。类元素。

$('.ImHere').each(function() {
    $(".ImHere" ).parent().nextAll('.add').first().css( "background-color", "red" );
});

https://jsfiddle.net/nf50k7og/42/

但它不起作用

Answer 1

在this

的回调中再次使用.Imhere代替.each

＆＃13;

$('.ImHere').each(function() {
    $(this).parent().nextAll('.add').first().css("background-color", "red");
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="unique1">
  <div class="ImHere"></div>
</div>
<button class="zoom" type="button">Zoom</button>
<button class="add" type="button">Add</button>

<div id="unique2">
  <div class=""></div>
</div>
<button class="zoom" type="button">Zoom</button>
<button class="add" type="button">Add</button>

<div id="unique3">
  <div class="ImHere"></div>
</div>
<button class="zoom" type="button">Zoom</button>
<button class="add" type="button">Add</button>

＆＃13;

Answer 2

试试这个：

    $("document").ready(function() {
      $('.ImHere').each(function() {
        $(".ImHere" ).parent().next("[type='button']").css( "background-color", "red" );
// OR if you want specific class
// $(".ImHere" ).parent().next(".add").css( "background-color", "red" );
      });
    });

https://jsfiddle.net/nf50k7og/54/

Answer 3

您也可以尝试这样

 $("document").ready(function() { $('.ImHere').parent().next('button').next('button.add').css('background-color','red') });

Answer 4

我建议你将单位包装在一个容器元素中。您可以使用.closest()遍历共同祖先，然后使用.find()来定位它。

并使用当前元素上下文，即this

$("document").ready(function() {
  $('.ImHere').click(function() {
    $(this).closest('.container').find('.add').css("background-color", "red");
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="container">
  <div id="unique1">
    <div class="ImHere">ImHere</div>
  </div>
  <button class="zoom" type="button">Zoom</button>
  <button class="add" type="button">Add</button>

</div>

<div class="container">
  <div id="unique1">
    <div class="ImHere">ImHere</div>
  </div>
  <button class="zoom" type="button">Zoom</button>
  <button class="add" type="button">Add</button>
</div>

隐藏每个类元素

4 个答案: