javascript - 在 WordPress 中添加自定义 ul 的事件链接

Question

我在 WordPress 侧边栏中有一个自定义列表(ul)。我想将事件类添加到列表项。

<ul  class="sidebar-list">
 <li> <a href="index.php/owle/">OWLE</a></li>
 <li><a href="index.php/sink-or-swim/">Sink or Swim</a></li>
 <li><a href="index.php/swim-and-survive/">Swim and Survive</a></li>
 <li><a href="index.php/vwsc/">VWSC</a></li>
 <li><a href="index.php/water-smart/">Water Smart</a></li>
 <li><a href="index.php/grey-medallion/">Grey Medallion</a></li>
 <li><a href="index.php/aquatic-pd-workshops/">Aquatic PD Workshops</a></li>

 <li><a href="index.php/edu-from-anywhere/">Edu From Anywhere</a></li>
 <li><a href="index.php/bronze-e-lifesaving/">Bronze e-Lifesaving</a></li>
 <li><a href="index.php/water-smart-award/">Water Smart Award</a></li>
  <li><a href="index.php/victorian-water-safety-certificate/">Victorian Water Safety Certificate</a></li>
 <li><a href="index.php/edu-from-anywhere-newsletter/">Edu From Anywhere Newsletter</a></li>
 <li><a href="index.php/edu-casual-instructor/">Edu Casual Instructor</a></li>

 <li><a href="index.php/grey-medallion/">Grey Medallion</a></li>
 <li><a href="index.php/sink-or-swim/">Sink or Swim</a></li>
 <li><a href="index.php/edu-instructor-of-year-profile/">Edu Instructor of year Profile</a></li>
  <li><a href="index.php/swim-survive-licensee-of-year/">Swim & Survive Licensee of year</a></li>
   </ul>


<li class="active"> <a href="index.php/owle/">OWLE</a></li>

应该看起来像“index.php/owle/”。

Answer 1

将其添加到您的 WordPress 中，它们是自定义的 JavaScript。很多主题都有这个。检查主题定制。

 var url = window.location;
 // Will only work if string in href matches with location
 $('sidebar-list li a[href="'+ url +'"]').parent().addClass('active');

 // Will also work for relative and absolute hrefs
  $('sidebar-list li a').filter(function() {
    return this.href == url;
 }).parent().addClass('active');  

如果你的主题没有这个，你必须对其进行硬编码。我建议您将其添加到 footer.php