遍历div内的元素

Question

html:

<div style="width: 260px;margin:25px 0 0 30px">
<input type="checkbox"  name="send_email" class="delete_followup" />Send email alerts
<input type="checkbox" value="delete" type="checkbox" />Send SMS alerts <button type="submit" name="delete" value="{{follower.id}}" class="delete_follower">Delete</button>
</div>

js:

$(".delete_followup").click(function(){
var $this = $(this);
$(this).find(".delete_follower").show();           
});

我希望在单击delete_followup 类时显示隐藏的按钮。我尝试了上面的jQuery代码，但没有效果。

- user2681579

---

@Sergio，是的，你的答案和Cherniv的答案都很好。我有些困惑该接受哪个答案。 - user2681579

你可以接受并投票赞同另一个 :) - Sergio

Answer 1

“delete_follower”元素不是“delete_followup”元素的子元素，而是兄弟元素，因此需要使用“siblings()”而不是“find()”。

$(".delete_followup").click(function(){
    var $this = $(this);
    $this.siblings(".delete_follower").show();           
});

- Arun P Johny

Answer 2

尝试使用 .nextAll ：

$(this).nextAll(".delete_follower").show();

在这里工作：http://jsfiddle.net/tw5XK/

- Ivan Chernykh

---

你的解决方案很简单。 - user2681579

Answer 3

试试这个：

$(".delete_followup").click(function () {
    if (this.checked) {
        $(this).siblings(".delete_follower").show();
    } else {
        $(this).siblings(".delete_follower").hide();
    }
});

演示 这里

- Sergio

Answer 4

你正在尝试向下搜索div，而你已经有了对所需元素的引用。这使得事情比它本来需要的更加复杂呵呵。

$(".delete_followup").click(function(){
   $(this).show();           
});

每当您触发点击事件时，实际点击的元素将作为函数的范围传递。由于您正在触发“.delete_followup”的单击，因此该div是您的元素范围。

- haz0rd