Question

我正在尝试使用jQuery为侧边栏菜单在活动菜单项上设置一个类。我不知道如何使用jQuery使用活动类。这是我的侧边栏菜单代码：

<div class="leftside-navigation">
  <ul class="sidebar-menu" id="nav-accordion">
    <li>
      <a class="mnb active" href="index.php">
        <i class="fa fa-dashboard"></i>
        <span>Dashboard</span>
      </a>
    </li>
    <li class="sub-menu">
      <a href="javascript:;">
        <i class="fa fa-book"></i>
        <span>Applied Loan</span>
      </a>
      <ul class="sub">
        <li><a class="mnb" href="loan_edu.php">Education</a></li>
        <li><a class="mnb" href="loan_med.php">Medical</a></li>
        <li><a class="mnb" href="loan_othr.php">Other</a></li>
      </ul>
    </li>
    <li class="sub-menu">
      <a href="javascript:;">
        <i class="fa fa-book"></i>
        <span>Approved Loan</span>
      </a>
      <ul class="sub">
        <li><a href="aprove_edu.php">Education</a></li>
        <li><a href="aprove_med.php">Medical</a></li>
        <li><a href="aprove_othr.php">Other</a></li>
      </ul>
    </li>
  </ul>
</div>

Answer 1

对于链接的每个元素，为a添加事件侦听器，删除所有活动类，并将当前$('a').click(function(){ $('a.active').each(function(){ $(this).removeClass('active'); }); $(this).addClass('active'); });设置为活动：

.active{
  color: red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="leftside-navigation">
  <ul class="sidebar-menu" id="nav-accordion">
    <li>
      <a class="mnb active" href="index.php">
        <i class="fa fa-dashboard"></i>
        <span>Dashboard</span>
      </a>
    </li>
    <li class="sub-menu">
      <a href="javascript:;">
        <i class="fa fa-book"></i>
        <span>Applied Loan</span>
      </a>
      <ul class="sub">
        <li><a class="mnb" href="loan_edu.php">Education</a></li>
        <li><a class="mnb" href="loan_med.php">Medical</a></li>
        <li><a class="mnb" href="loan_othr.php">Other</a></li>
      </ul>
    </li>
    <li class="sub-menu">
      <a href="javascript:;">
        <i class="fa fa-book"></i>
        <span>Approved Loan</span>
      </a>
      <ul class="sub">
        <li><a href="aprove_edu.php">Education</a></li>
        <li><a href="aprove_med.php">Medical</a></li>
        <li><a href="aprove_othr.php">Other</a></li>
      </ul>
    </li>
  </ul>
</div>

JOIN

Answer 2

查看此链接 - public class DigitsLimitValidator implements ConstraintValidator<DigitsLimit, BigInteger> { private int min; private int max; @Override public void initialize(DigitsLimit value) { min = value.min(); max = value.max(); } @Override public boolean isValid(BigInteger value, ConstraintValidatorContext cxt) { return value != null && BigIntegerMath.log10(value, RoundingMode.FLOOR) + 1 >= min && BigIntegerMath.log10(value, RoundingMode.FLOOR) + 1 <= max; } }

这是jQuery部分：

@RedisHash("Foo")
public class Foo implements Serializable {

  @Id
  @DigitsLimit(min = 15, max = 25)
  private BigInteger id;

  @Indexed
  private Status status;
}

Answer 3

我认为你有一个例子，如何在之前的答案中使用jQuery进行设置。如果您需要使用PHP进行检查，我认为这可能会对您有所帮助。

1）在包含header.php或menu.php之前，在你的页面中声明一个变量（例如：aboutus.php，cotactus.php）。无论你的导航标记是哪个文件。

 <?php
 $page = 'aboutus';
 include('header.php');
 ?>

2）现在在header.php中，您读取此变量的值以确定正在查看的页面，因此您为其导航链接指定了不同的/额外的CSS样式。

   <ul class="mainmenu" >
      <li class="menuitem <?php if($page=='aboutus'){echo 'active';}?>" >
        <a href="aboutus.php"><span>About Us</span></a>
      </li>
      <li class="menuitem <?php if($page=='contactus'){echo 'active';}?>" >
        <a href="contactus.php"><span>Contact Us</span></a>
      </li>  
   </ul>

希望它有所帮助...

Answer 4

通过使用jquery：

var url =window.location;
$('#leftside-navigation a[href="' + url + '"]').addClass('active')

如何使用jquery激活侧边栏菜单？

4 个答案: