Javascript 单击一个链接将禁用java脚本中的其他链接

你好，我想禁用所有其他链接，除了我点击其中一个链接后点击的一个

以下是我目前的代码：

JavaScript

$(".link-chart").click(function($e) {
    if($(this).find(".link-selector-two").hasClass('red')) {
          $('.link-selector-two', this).addClass('cssclass');
          $('.link-selector-one', this).addClass('cssclass');
    } else {
      $('.link-selector-two', this).removeClass('cssclass');
    }
});

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="#" class="link-chart lx-link-chart">
  <div class="link-selector-one">
    <div class="link-selector-two red">One</div>
  </div>
</a>
<a href="#" class="link-chart lx-link-chart">
  <div class="link-selector-one">
    <div class="link-selector-two red">Two</div>
  </div>
</a>

例如，如果我单击第一个链接以禁用第二个链接，如果我再次单击第一个链接，它将按照现在的工作方式取消选择第一个链接，这样第二个链接将再次可供选择。如果单击第二个链接以禁用第一个链接，则第二个链接的选项相同

---

欢迎提供任何帮助，让我知道应该采用哪种方法

您可以这样做：

JS SCSS

---

这里有一个例子来说明这一点。仅供参考，我添加了第三个链接，这样您就可以看到它的工作原理与您想要添加的链接的工作原理完全相同。

请查看toggleClass，而不是（这）您想要实现什么？链接链接到哪里？你真的需要它们吗？如果它们可以被其他元素替换，您可以按照建议使用disabled属性。我想禁用该元素。其余链接不是选定的链接。再次单击以恢复链接。我知道了。我的问题是，这些链接是什么？他们是否链接到另一个页面？根据您的代码，它们不会，因为href是“#”。

var $linkChart = $('.link-chart');

$linkChart.click(function(e) {
  $linkChart.each(function() {
    if (e.currentTarget !== this) {
      $(this).toggleClass('disabled');
    }
  });
});

.link-chart { 
  &.disabled {
    pointer-events: none;
    opacity: 0.25;
  }
}