0

我有一系列不同类别的行。

<tr class="head">...
<tr class="group">...
<tr class="item">...
<tr class="item">...
<tr class="item">...
<tr class="group">...
<tr class="item">...
<tr class="item">...
<tr class="item">...
<tr class="group">...
<tr class="item">...
<tr class="item">...
<tr class="item">...

假设我的上下文在其中一个项目中，我如何选择之前、之后和包括它的所有行，即项目，而不跨越组？

在此示例中，无论我在哪个项目行，我都应该始终生成三个项目行的集合。

目前我有这个，虽然它有效，但我希望有一种更清洁的方法。

var $itemRows = $targetRow.prevUntil('tr.group').add($targetRow.nextUntil('tr.group')).add($targetRow);

类似的东西.siblings('tr.item')会得到所有九个项目，而不是三个连续的项目。而且我不能把它们放在 tbody 中，因为这已经在 tbody 中并且嵌套它们是无效的 html。

我已将其改进为

var $itemRows = $targetRow.prevAll('tr.group:first').nextUntil('tr.group');
4

1 回答 1

2

假设this是其中一行（而不是组），您可以这样做：

在测试了许多场景之后，我发现这是有效的：

$(this).prevUntil('tr.group').andSelf().nextUntil('tr.group').andSelf()

问题是当您单击组中的第一个项目时，其他组合（如 gdoron）对我不起作用。

您可以在这里看到这项工作：http: //jsfiddle.net/jfriend00/mks74/

我认为必须有一种更清洁的方法，所以我一直在努力，这就是我发现的：

$(this).prevAll('tr.group:first').nextUntil('tr.group')

您可以在这里看到这项工作：http: //jsfiddle.net/jfriend00/HZVnX/

这里有用的（jQuery 似乎没有提供）是一个 jQuery 方法，它获取满足某些选择器标准的先前兄弟。我们可以自己制作这样的：

jQuery.fn.prior = function(selector) {
    return (this.pushStack(this.prevAll(selector).first()));
};

然后，解决这个问题的代码变得更符合逻辑：

$(this).prior('tr.group').nextUntil('tr.group')
于 2012-05-31T21:38:42.420 回答