检查所有复选框nextUntil

我有一个列表与复选框是这样的：

<ul> 
    <li class="omzet_first"><input type="checkbox" name="omzet" id="12" value="12" alt="Opbrengsten" checked="checked">Opbrengsten</li> 
    <li class="omzet_second"><input type="checkbox" name="omzet" id="13" value="13" alt="Netto Omzet">Netto Omzet</li> 
    <li class="omzet_second"><input type="checkbox" name="omzet" id="14" value="14" alt="Overige Opbrengsten">Overige Opbrengsten</li> 
    <li class="omzet_first"><input type="checkbox" name="omzet" id="15" value="15" alt="Kosten van grond-en Hulpstoffen/Uitbesteed werk">Kosten van grond-en Hulpstoffen/U</li> 
    <li class="omzet_second"><input type="checkbox" name="omzet" id="16" value="16" alt="Inkoopprijs van de verkopen">Inkoopprijs van de verkopen</li> 
    <li class="omzet_second"><input type="checkbox" name="omzet" id="17" value="17" alt="Kosten uitbesteed werk">Kosten uitbesteed werk</li> 
    <li class="omzet_first"><input type="checkbox" name="omzet" id="18" value="18" alt="Personeelskosten">Personeelskosten</li> 
    <li class="omzet_second"><input type="checkbox" name="omzet" id="19" value="19" alt="Lonen &amp; Salarissen">Lonen &amp; Salarissen</li> 
    <li class="omzet_second"><input type="checkbox" name="omzet" id="20" value="20" alt="Sociale lasen">Sociale lasen</li> 
    <li class="omzet_second"><input type="checkbox" name="omzet" id="21" value="21" alt="Pensioen lasten">Pensioen lasten</li> 
</ul>

当与类omzet_first李一复选框被选中我想检查与类omzet_second李全接下来的复选框，直到下一个李.omzet_first。

我试过，但没有工作

$('.omzet_first input:checked').each(function() { 
    $(this).nextUntil(".omzet_first", ".omzet_second input:checkbox").prop("checked", true); 
});

任何建议，该怎么办？

来源

2012-07-17 Leon van der Veen

在您的事件处理程序中，this是复选框。您必须适当地浏览DOM树（在找到兄弟姐妹之前向上移动到其父亲.omzet_first，然后向下移动）。另请注意，您也应该使用选择器.omzet_first和nextUntil。

$('.omzet_first input:checked').each(function() { 
    $(this).closest(".omzet_first") 
      .nextUntil(".omzet_first") 
      .find("input:checkbox") 
      .prop("checked", true); 
});

来源

2012-07-17 07:51:37 Jon

这将事件处理程序只能绑定到最初检查发现的复选框。（另外，'this.checked'（可以说）更容易阅读，但肯定比$（this）.prop（“checked”）更有效。） – nnnnnn 2012-07-17 07:59:00

@nnnnnn：出于某种原因，我精神上错过了'：checked'部分。它现在是合理的，编辑代码来反映。 – Jon 2012-07-17 08:05:11

你.each()循环与:checked处理任何在当时检查复选框的选中元素代码运行 - 它不会对盒子用户点击响应。

如果这个想法是你需要处理该事件的用户的响应点击：

$('.omzet_first input[type="checkbox"]').click(function() { 
    $(this).parent().nextUntil(".omzet_first") 
      .find('input[type="checkbox"]').prop("checked", this.checked); 
});

要解释这些代码：当omzet_first一个复选框被点击查找其父（李）然后选择所有父母的兄弟姐妹直到下一个omzet_first，然后找到这些lis中的子复选框并设置其checked属性。（如果李不输入的直接父，你会使用$(this).closest(".omzet_first")代替$(this).parent()。）

演示：http://jsfiddle.net/498vw/

来源

2012-07-17 07:57:07 nnnnnn

检查所有复选框nextUntil

回答

相关问题