Question

在以下代码中，我正在执行以下操作：

在＆＃34;元素中获取所有子A标签＆＃34; （链接）;
```
var links = element.find("a");
```

查找Id位于A标签之一的所有Div（窗格）href;

var panes = links.map(function () { 
  return $("#" + this.href.split("#")[1]); 
});

当点击其中一个链接时，我需要删除类＆＃34;活动＆＃34;从所有窗格中添加＆＃34;活跃＆＃34;类到窗格的类，其中的ID与clickedLink.href.split相同（＆＃34;＃＆＃34;）[1]。
```
links.bind("click", function (event) {         

  panes.not("id*=" + this.href.split("#")[1]).removeClass("active");
  panes("#" + this.href.split("#")[1]).addClass("active");

}
```

我在（2）两个＆＃34;窗格中遇到问题......＆＃34;代码行。

有人可以告诉我该怎么做吗？

Answer 1

这样做的典型方法是：

从所有窗格中删除active类
只需将其添加回您想要的

您不需要在panes内为第二部分选择（语法不正确，但无关紧要）; id在文档中是唯一的。所以：

links.bind("click", function (event) {    
  $.each(panes, function() { $(this).removeClass("active") });     
  $("#" + this.href.split("#")[1]).addClass("active");
});

var element = $(document.body);
var links = element.find("a");

var panes = links.map(function () { 
  return $("#" + this.href.split("#")[1]); 
});

console.log(panes);

links.bind("click", function (event) {         
  $.each(panes, function() { $(this).removeClass("active") });
  $("#" + this.href.split("#")[1]).addClass("active");
});

.active {
  background-color: red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="div01">div 01</div>
<div id="div02">div 02</div>
<div id="div03">div 03</div>
<div id="div04">div 04</div>
<div id="div05">div 05</div>

<a href="#div01">link to div 01</a>
<a href="#div02">link to div 02</a>
<a href="#div03">link to div 03</a>
<a href="#div04">link to div 04</a>
<a href="#div05">link to div 05</a>

改变许多和一个元素的类

1 个答案: