jQuery:使用类查找上一个元素

时间:2013-05-08 22:22:03

标签: javascript jquery

我有一个非常简单的问题。

如何找到另一个元素的前一个元素?我尝试了下面的代码但没有成功。

HTML:

<div class = "A">HERE</div>

<div class="B">
    <div class="C" style="width:50px;height:50px;background-color:#000000;"></div>
</div>

JS:

$('.C').click(function() {

        alert($(this).closest('.A').html());

});

小提琴:http://jsfiddle.net/Mcujp/4/

4 个答案:

答案 0 :(得分:23)

如果您尝试获取前一个兄弟,请使用.prev()

如果您正在尝试获取父级的兄弟(如您的示例中所示),请使用.parent().prev()

答案 1 :(得分:7)

试试这个:

$('.C').click(function() {

        alert($(this).parent().prev('.A').html());

});

答案 2 :(得分:5)

$('.C').click(function() {
   alert($(this).closest('.B').prev('.A').html());
});

答案 3 :(得分:0)

如果您要定位顶级父母中最亲近的孩子,可以按照以下定义进行操作。

让我们假设您有类似

的HTML
<div class="top-parent">
  <div class="parent">
    <button class="add-button">Child of 1st Parent DIV</button>
  </div>
  <div class="parent">
    <button class="add-button">Child of 2nd Parent DIV</button>
  </div>
</div>
<script>
$(document).on('click','.add-button',function(){
   $(this).parents('.parent').prev().closest('.parent').find('.add-button').text('im clicked by one of the button next to my parent')
   $(this).parents('.parent').remove();
})
</script>

类似地,如果您要定位祖父母的下一个父容器,则只需将.prev()更改为.next()

希望我可以轻松定义:)