Question

所以，我有这个菜单链接到一些动态显示的内容，我一直在尝试编写一些改变当前活动项目字体的js代码。我的问题是，如果该项目不再有效，它永远不会取消选择该项目。

的jsfiddle：

jquery的：

$(document).ready(function() {

  $("a.menu2").click(function(e) {
  $('.ShowClickedContent').html($($(this).attr('href')).html()); //dynamic content
  var clicks = 0;

      if(clicks % 2 == 0){
          $(this).css('font-family','gillsans');
      }else{
          $(this).css('font-family','gillsanslight');
      }
      ++clicks;


});

});

任何帮助都会很棒。注意：我需要在最终解决方案中使用精确的showClickedContent查询，否则会出现边际问题。

Answer 1

https://jsfiddle.net/ynrnt6xL/

$(document).ready(function() {

  const buttons = $('.menu2');
  const clear = function() {
    $.each( buttons, function(index, btn) {
        $(btn).removeClass('selected');
    })
  }

    $.each( buttons, function(index, btn) {
    $(btn).click( function(e) {
        clear();
      $(this).addClass('selected');
    });
  });

});

Answer 2

你可以用CSS做到这一点！我没有弄乱字体，但我用font-size作为例子：

a:active, a:focus {font-size:15px;}

只需将font-size替换为font-family等等......

单击更改活动菜单项字体

2 个答案: