jquery - jQuery addclass方法不适用于带有jQuery的href链接

如果我使用这个，我就不能使用addclass方法来添加活动类，也就是说，如果我只使用它的工作正常，但是如果我和$("#mylink").attr("href",uri);一起使用，活动类是不接受的。这里我的uri是'$("#mylink").addClass('active')'请帮我解决这个问题。

$(document).ready(function() {
  $("#mylink").click(function() {
    var getuid = $ {
      userId
    };
    var testnum = btoa(getuid);
    var uri = "sysadmin_delivery_ready.html?uid=" + testnum;
    $("#mylink").attr("href", uri);
    var clsval = this.className;
    if (clsval == '') {
      alert("blank");
      $("#mylink").addClass('active');
    } else {
      alert("ac");
      $("#mylink").removeClass('active');
    }
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<ul class="nav" id="side-menu">
  <li>
    <a href="#">
      <i class="fa fa-dashboard fa-fw"></i> Data
    </a>
  </li>
  <li>
    <a href="#">
      <i class="fa fa-edit fa-fw"></i> General Information
    </a>
  </li>
  <li>
    <a href="#" id="mylink">
      <i class="fa fa-sign-out fa-fw"></i> Deliver
    </a>
  </li>
</ul>

最佳答案

请在此处查找工作片段：
由于我并没有真正改变你的代码的功能性，你能评论一下它有什么问题吗？
我不明白。

$(document).ready(function() {
  $("#mylink").click(function() {
    // I commented some of the code to have a working snippet…
    /*var getuid = $ {
      userId
    };
    var testnum = btoa(getuid);
    var uri = "sysadmin_delivery_ready.html?uid=" + testnum;*/

    var uri = "#foo"; // Added for test
    $("#mylink").attr("href", uri);
    var clsval = this.className;
    if (clsval == '') {
      // … and changed alert into console.log
      console.log("blank");
      $("#mylink").addClass('active');
    } else {
      console.log("ac");
      $("#mylink").removeClass('active');
    }

  });
});

.active{
  color: red;
}
li{
  list-style: none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" />
<ul class="nav" id="side-menu">
  <li>
    <a href="#">
      <i class="fa fa-dashboard fa-fw"></i> Data
    </a>
  </li>
  <li>
    <a href="#">
      <i class="fa fa-edit fa-fw"></i> General Information
    </a>
  </li>
  <li>
    <a href="#" id="mylink">
      <i class="fa fa-sign-out fa-fw"></i> Deliver
    </a>
  </li>
</ul>

注意，我添加了FontAwesome 4和样式化的li以及active类以获得更好的输出。

关于jquery - jQuery addclass方法不适用于带有jQuery的href链接，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/49895679/