Jquery-如何访问下一个元素

我有一个链接列表

<ul class="categories-list">
  <li><a class="active" href="hematologia">Hematologia</a></li>
  <li><a class="" href="biochemia">Biochemia</a></li>
  <li><a class="" href="endokrynologia">Endokrynologia</a></li>
  <li><a class="" href="badania-moczu">Badania moczu</a></li>
  <li><a class="" href="diagnostyka-alergii">Diagnostyka alergii</a></li>
  <li><a class="" href="cytologia">Cytologia</a></li>
  <li><a class="" href="koagulologia">Koagulologia</a></li>
  <li><a class="" href="serologiawirusologia">Serologia/wirusologia</a></li>
  <li><a class="" href="mikrobiologia">Mikrobiologia</a></li>
  <li><a class="" href="mikologia">Mikologia</a></li>
  <li><a class="" href="pasozyty-krwi">Pasożyty krwi</a></li>
  <li><a class="" href="autoimmunologia">Autoimmunologia</a></li>
  <li><a class="" href="choroby-dziedziczne">Choroby dziedziczne</a></li>
  <li><a class="" href="parazytologia">Parazytologia</a></li>
  <li><a class="" href="histopatologia">Histopatologia</a></li>
  <li><a class="" href="badanie-kalu">Badanie kału</a></li>
  <li><a class="" href="autoszczepionki">Autoszczepionki</a></li>
  <li><a class="" href="plyny-biologiczne">Płyny biologiczne</a></li>
  <li><a class="" href="proteinogram">Proteinogram</a></li>
  <li><a class="" href="profile-ogolne">Profile ogólne</a></li>
  <li><a class="" href="profile-narzadowe">Profile narządowe</a></li>
  <li><a class="" href="profile-geriatryczne">Profile geriatryczne</a></li>
  <li><a class="" href="profile-pcr">Profile PCR</a></li>
  <li><a class="" href="profile-podrozne">Profile podróżne</a></li>
</ul>

我需要在列表中找到下一个或上一个元素（取决于单击哪个箭头），然后通过编程方式单击它来更改活动元素

---

如何实现这一点？

您可以使用以下脚本：

jQuery（'.arrows a'）。单击（函数（e）{
if（this.textContent.trim（）=“left”）{
if（$（'ul.categories-list a.active'）.parent（）.index（）==0{return false；}
$（'ul.categories-list a.active'）.removeClass（'active'）.parent（）
.prev（'li'）.find（'a'）.addClass（'active'）；
}否则{
if（$（'ul.categories-list a.active'）.closest（'li'）.index（）===$（'ul.categories-list li'）.length-1）{return false；}
$（'ul.categories-list a.active'）.removeClass（'active'）.parent（）
.next（'li'）.find（'a'）.addClass（'active'）；
}
});
.active{
颜色：红色；
背景：黄色；
边框：黑色1px实心；
}
李{
显示：内联块；
}






















































您可以使用以下脚本：


jQuery（'.arrows a'）。单击（函数（e）{
if（this.textContent.trim（）=“left”）{
if（$（'ul.categories-list a.active'）.parent（）.index（）==0{return false；}
$（'ul.categories-list a.active'）.removeClass（'active'）.parent（）
.prev（'li'）.find（'a'）.addClass（'active'）；
}否则{
if（$（'ul.categories-list a.active'）.closest（'li'）.index（）===$（'ul.categories-list li'）.length-1）{return false；}
$（'ul.categories-list a.active'）.removeClass（'active'）.parent（）
.next（'li'）.find（'a'）.addClass（'active'）；
}
});
.active{
颜色：红色；
背景：黄色；
边框：黑色1px实心；
}
李{
显示：内联块；
}






















































第一个答案是有效的，除非您超出了第一个或最后一个元素，因此您需要单独处理这些元素，或者阻止任何进一步的步骤，或者循环它们，如下所示：


jQuery（'.arrows a'）。单击（函数（e）{
var active=$（'ul.categories-list a.active'）；
var activeIndex=active.parent（）.index（）；
if（this.textContent.trim（）=“left”）{
如果（activeIndex>0）{
active.removeClass（'active'）.parent（）
.prev（'li'）.find（'a'）.addClass（'active'）；
}否则{
active.removeClass（“active”）；
$（'.categories list li:last child a'）.addClass（“活动”）；
}
}否则{
如果（activeIndex=$（'ul.categories-list li'）。长度-1）{
active.removeClass（“active”）；
$（'.categories list li:first child a'）.addClass（“active”）；
}否则{
active.removeClass（'active'）.parent（）
.next（'li'）.find（'a'）.addClass（'active'）；
}
}
});
.active{
颜色：红色；
背景：黄色；
边框：黑色1px实心；
}






















































第一个答案是有效的，除非您超出了第一个或最后一个元素，因此您需要单独处理这些元素，或者阻止任何进一步的步骤，或者循环它们，如下所示：


jQuery（'.arrows a'）。单击（函数（e）{
var active=$（'ul.categories-list a.active'）；
var activeIndex=active.parent（）.index（）；
if（this.textContent.trim（）=“left”）{
如果（activeIndex>0）{
active.removeClass（'active'）.parent（）
.prev（'li'）.find（'a'）.addClass（'active'）；
}否则{
active.removeClass（“active”）；
$（'.categories list li:last child a'）.addClass（“活动”）；
}
}否则{
如果（activeIndex=$（'ul.categories-list li'）。长度-1）{
active.removeClass（“active”）；
$（'.categories list li:first child a'）.addClass（“active”）；
}否则{
active.removeClass（'active'）.parent（）
.next（'li'）.find（'a'）.addClass（'active'）；
}
}
});
.active{
颜色：红色；
背景：黄色；
边框：黑色1px实心；
}






















































active\u element.next（）
和
active\u element.prev（）
。分别是
$（'a.active'）.removeClass（'active'）.parent（）.next（）.find（'a'）.addClass（'active'）
active\u element.next（）
和
active\u element.prev（）
。分别是
$（'a.active'）.removeClass（'active'）.parent（）.next（）.find（'a'）.addClass（'active'）
jQuery('.arrows a').click(function (e) {
        e.preventDefault();
        var active_element = jQuery( "ul.categories-list li a.active" );
        alert(active_element)
    });