javascript - jquery 选择下一个 iframe

Question

html代码

<div style="width: 1000px;margin: auto" class="cf"> 
<div class="bo" data-href="../../link1">click</div>
<div class="bo" data-href="../../link2">click 2</div>
<div class="bo" data-href="../../link3">click 3</div>
<iframe class='iframe hd' scrolling='no' frameborder='0'></iframe>

<div class="bo" data-href="../../link1">click</div>
<div class="bo" data-href="../../link2">click 2</div>
<div class="bo" data-href="../../link3">click 3</div>
<iframe class='iframe hd' scrolling='no' frameborder='0'></iframe>

<div class="bo" data-href="../../link1">click</div>
<div class="bo" data-href="../../link2">click 2</div>
<iframe class='iframe hd' scrolling='no' frameborder='0'></iframe>

我尝试当我点击任何 div 时，下一个 iframe 删除 hd 类，并且只有这个特定 div 的下一个 iframe 我点击它

我已经测试过这个选择器

$(".iframe:first")

不工作

谢谢

Answer 1

试试这个 - http://jsfiddle.net/aa8yK/

$("div").on("click", function() {
    var iframes = $(this).nextAll("iframe");
    iframes.eq(0).removeClass("hd");
});​

Answer 2

这里的技巧是确保只选择下一个 iframe，而不是所有 iframe 兄弟姐妹（后者很简单 - 你可以只使用nextAll()）。

尝试这个

$('div').on('click', function() {               
    $(this).next('iframe').add($(this).nextUntil('iframe').next()).removeClass('hd');
});

[编辑] - 一种更简单的方法，以及@Zoltan 答案的变体，就是

$(this).nextAll('iframe:eq(0)').removeClass('hd');