1

我想为单击的当前菜单项赋予样式。为此，我添加了一个使用 jQuery 的类。我为此使用了以下代码。

jQuery(document).ready(function(){  
    jQuery('#submenu li a').click(function() {  
        jQuery(this).addClass('current_menu');
    });
});

但是当我单击另一个菜单项时，该类current_menu不会被删除并且样式保持不变。单击另一个菜单项时，我想删除样式。请参阅http://itnews4india.com/。我该如何解决这个问题？

4

9 回答 9

2

在您的代码中，您只需添加类，但永远不要删除旧版本。

jQuery(document).ready(function(){  
    jQuery('#submenu li a').click(function() {  

        // remove the old menu items class
        jQuery('.current_menu').removeClass('current_menu');   

        // add the new one
        jQuery(this).addClass('current_menu');
    });
});

根据您的代码的其余部分，删除中的选择器可能必须调整为类似#submenu li a.current_menu'.

于 2013-06-05T07:54:08.177 回答
1

问题是您必须class在添加之前删除。

jQuery(document).ready(function(){  
    jQuery('#submenu li a').click(function() { 
        jQuery('a.current_menu').removeClass('current_menu'); 
        jQuery(this).addClass('current_menu');
    });
});
于 2013-06-05T07:55:34.270 回答
1

还有一个 toggleClass 函数：jQuery Api toggleClass

$('#submenu li a').click(function() {
    $(this).toggleClass('current_menu just_menu');
};

请注意，该元素最初需要这些类之一！

于 2013-06-05T07:56:15.270 回答
1

风格color被.current_menu 覆盖#submenu li a

添加 #submenu li a.current_menu {color:#fff;} 你的CSS

于 2013-06-05T08:04:52.037 回答
1

尝试这个

jQuery(document).ready(function(){  
  jQuery('#submenu li a').click(function() {  
    jQuery("#submenu li a").removeClass('current_menu');
     jQuery(this).addClass('current_menu');
 });
});
于 2013-06-05T07:53:58.473 回答
1

做这个：

jQuery(document).ready(function(){  
    jQuery('#submenu li a').click(function() { 
        jQuery('a.current_menu').removeClass('current_menu'); 
        jQuery(this).addClass('current_menu');
    });
});

代码中的第三行current_menu将从链接中删除该类，如果它们已经存在的话。

于 2013-06-05T07:54:15.727 回答
1

尝试这个：-

jQuery(document).ready(function(){
   jQuery('#submenu li a').click(function() {
      // Remove class from all anchors inside list
      jQuery('#submenu li a').removeClass('current_menu');

      // Add class on selected/clicked anchor
      jQuery(this).addClass('current_menu');
   });
});
于 2013-06-05T07:54:21.703 回答
1

请试试这个： 

$(document).ready(function(){  
        $('#submenu li a').click(function() {  
            $('#submenu li a').removeClass('current_menu');
            $(this).addClass('current_menu');
        });
    });
于 2013-06-05T07:54:46.707 回答
0 
jQuery(document).ready(function() {  
    jQuery('#submenu li a').click(function() {
        jQuery('#submenu li').find('a').each(function(){
            jQuery(this).removeClass('current_menu');
        }) 
        jQuery(this).addClass('current_menu');
    });
});
于 2013-06-05T07:56:08.803 回答