jQuery 切片和点击事件

StackOverflow https://stackoverflow.com/questions/43811

  •  09-06-2019
  •  | 
  •  

题

这可能是一个非常简单的 jQuery 问题，但我在文档中 10 分钟后无法回答它，所以......

我有一个复选框列表，我可以使用选择器获取它们 'input[type=checkbox]'. 。我希望用户能够按住 Shift 键并单击并选择一系列复选框。为了实现这一点，我需要获取列表中复选框的索引，以便我可以将该索引传递给 .slice(start, end). 。当用户单击某个框时如何获取索引？

有帮助吗？

解决方案

以下选择器也应该在 jQuery 中工作： input:checkbox.

然后您可以将 :gt(index) 和 :lt(index) 一起过滤，所以如果你想要第五到第七个复选框，你可以使用 input:checkbox:gt(4):lt(2).

要获取当前单击的复选框的索引，只需使用 $("input:checkbox").index($(this)).

其他提示

这是一个快速的解决方案，但我会给每个复选框一个唯一的 ID，也许带有索引提示，如下所示：

<input id="checkbox-0" type="checkbox" />
<input id="checkbox-1" type="checkbox" />
<input id="checkbox-2" type="checkbox" />
<input id="checkbox-3" type="checkbox" />
<input id="checkbox-4" type="checkbox" />

然后您可以轻松获取索引：

$(document).ready(function() {
  $("input:checkbox").click(function() {
    index = /checkbox-(\d+)/.exec(this.id)[1];
    alert(index);
  });
});

感谢您的回答，萨姆朱德森。

经过进一步的实验，我发现你甚至可以只使用 $(':checkbox') 选择它们。有趣的是，您可以使用 .slice() 函数来获取范围，但您也可以选择在选择器中执行此操作 :gt 和 :lt. 。我确实找到了语法 .slice() 不过，比使用选择器过滤器更干净。

我不得不说，我不太喜欢 Ryan Duffield 的解决方案，因为它需要更改标记，并且涉及重复代码。

@戈尔加波尔：我想有时我需要不那么拘泥于字面意思来回答问题。:-) 我认为你被锁定需要某种索引。我想你会发现，随着你更多地使用 jQuery，你通常不需要做那样的事情。

许可以下： CC-BY-SA 和 归因
不隶属于 StackOverflow
scroll top