jquery:如何循环选择多个项目

jquery: how to cycle through multiple items selected

本文关键字：选择 项目 循环 何循环 jquery      更新时间：2023-09-26

我有一个菜单栏，上面有反映操作类别的顶部菜单项，这些操作是对可见数据的排序或过滤操作：

<ul class="menu-bar">
        <li class="top-menu-item"><a class="clear-filter">Clear</a></li>
        <li class="top-menu-item"><a><span class="category Category1">Category1</span></a>
          <ul>
           <li><a>FilterAction</a></li>           
            <li><a>SortAction</a></li>           
          </ul>
        <li class="top-menu-item"><a><span class="category Category2">Category2</span></a>
        ...
</ul>

当用户选择排序或筛选操作时，我有一个脚本，它当前将相应跨度中的文本替换为操作的名称，并向该跨度添加一个适当的类以指定选择，因此，如果您在Category1菜单中选择了FilterAction，则该跨度将如下所示：

<span class="category Category1 set-filter">FilterAction</span>

如果您选择SortAction，则会将跨度设置为

<span class="category Category1 set-sort">SortAction</span>

如果你同时选择了：

<span class="category Category1 set-filter set-sort">SortAction, FilterAction</span>

排序动作总是列在第一位。

一次只能有一个排序操作，但一次的筛选器数量没有限制。

由于一次只能有一个排序，所以更改排序非常容易——当我设置新的排序时，我会检查现有的set-sort类，删除set-sort类，然后用保留为span类的原始类别（上面的Category1）适当地替换文本，或者删除逗号之前的所有文本（包括逗号），从而只剩下过滤文本。这是毫无问题的。

现在，删除筛选器的唯一方法是单击Clear链接，该链接应将所有具有set-filter类的span替换为原始类别名称或现有排序操作。

我一直遇到的问题是，无法同时选择所有带有sort-filter的跨度，然后循环以相应地更改文本和类。我目前有这样的coffeescript代码：

$target = $(event.target) # this will be the clear button
$categorySpan = $target.parents(".menu-bar").eq(0).find(".set-filter")
<< code to perform actions on $categorySpan >>

现在，这显然不起作用，它只会在所有选定的跨度上执行一揽子操作，而不是单独循环每个跨度。我最初是这样尝试的：

for $categorySpan in $target.parents(".menu-bar").eq(0).find(".set-filter")

但后来我无法访问跨度的关键属性，比如文本。

进行这种循环操作的正确方法是什么？

我不确定你想做的一切……但这个循环可以让你在每个集合排序span中循环，并将文本应用到span，或者对每个span执行任何你想执行的操作。

$('span.set-sort').each(function () {
    var $this = $(this);
    $this.text('Whatever you want').addClass('hello').removeClass('world');
});
相关文章：