使用 jquery 获取 HTML 表中特定行的直接几行的问题

Question

我在我的 asp.net 网站中使用嵌套转发器。使用这些转发器，我以表格形式显示产品列表（表格放置在外部转发器中）。在外部（顶级）中继器中，我有主要产品，在内部中继器中，我有一些与外部中继器中的产品相关的选项（如果有的话）。下订单时，用户只能选择其中的 2 个与任何产品关联的选项。为了进行此验证，我使用带有以下客户端 js 函数的自定义验证器。

function CountChosenAdditionalOptions(source, arguments) {

        $('table.productslist tbody tr.productTextAlign').each(function () {
            var count = 0;
            $('table. productslist tbody tr.additionalOptions').each(function () {
                var chooseAdditionalOptionsCheckBoxtd = $(this).children("td.chooseOptionCheckBox");
                var additionalOptionChosen = $(chooseAdditionalOptionsCheckBoxtd).children("input[type=checkbox]")[0].checked;
                if (additionalOptionChosen) {
                    count = count + 1;
                }
            });
            if (count > 2) {
                arguments.IsValid = false;
                return false;
            }
        });       
    }

中继器呈现的示例 HTML 如下

<table class= “productslist”>
<tbody>
<tr>....</tr>
<tr>....</tr>
<tr class=”productTextAlign”>
.....
.....
</tr>
<tr class=”additionalOptions”>.....</tr>
<tr class=”additionalOptions”>.....</tr>

<tr class=”additionalOptions”>.....</tr>

<tr class=”additionalOptions”>.....</tr>

<tr class=”additionalOptions”>.....</tr>
<tr>...</tr>

<tr class=”productTextAlign”></tr>

<tr class=”additionalOptions”>.....</tr>

<tr class=”additionalOptions”>.....</tr>

<tr class=”additionalOptions”>.....</tr>

<tr class=”additionalOptions”>.....</tr>
</tbody>
</table>

验证背后的想法是迭代外部中继器，并针对其中的每个项目检查内部中继器中选择的选项数量。但是由于中继器只是简单地呈现为表格，对于每个产品行，使用如上所述的 js 函数，它会尝试查找附加选项行并递增计数，无论附加选项行是否与该特定产品相关联。

有人可以帮助更新 js 函数来识别与特定产品相关的选项并增加指示所选选项数量的计数吗？

更新：

function CountChosenAdditionalOptions(source, arguments) {

        $('table.productslist tbody tr.productTextAlign').each(function () {
            var count = 0; $(this).nextUntil("tr.productTextAlign").each(function () {
                var chooseAdditionalOptionsCheckBoxtd = $(this).children("td.chooseOptionCheckBox");
                var additionalOptionChosen = $(chooseAdditionalOptionsCheckBoxtd).children("input[type=checkbox]")[0].checked;
                if (additionalOptionChosen) {
                    count = count + 1;
                }
            });
            if (count > 2) {
                arguments.IsValid = false;
                return false;
            }
        });       
    }

Answer 1

我想你想要nextUntil。

http://api.jquery.com/nextUntil/

$('table.productslist tbody tr.productTextAlign').each(function () {

    $(this).nextUntil("tr.productTextAlign").each(function () {

    }
}

第二个循环将从之后开始的每一行运行当前的 productTextAlign 并继续，直到找到另一个 productTextAlign。