javascript - Javascript在点击时添加类

Question

我正在尝试在单击链接时将类添加到链接

这是代码

jQuery(document).ready(function(){
   jQuery('#block-block-23 li a').click(function() {
     jQuery('#block-block-23 li a').addClass("selected");

   });
   });

问题是单击链接时正在添加该类，但是当页面加载时它会自动被删除。我也尝试过 toggleClass() 函数

Answer 1

可能有两种情况...

1. 该应用程序是多页的。

在这种情况下，您可以在另一个页面中对该类进行硬编码。

1. 该应用程序是单页的，链接仅用于装饰目的。

在这种情况下，您可以阻止链接的默认行为。

jQuery('#block-block-23 li a').click(function(event) {
   event.preventDefault();
   jQuery(this).addClass("selected");
});

Answer 2

解决了我的问题

jQuery(document).ready(function(){
jQuery("#block-block-23 li a").each(function(){
   if(jQuery(this).attr('href') == (location.pathname)){
     jQuery(this).addClass('active');
   }
});  
});

Answer 3

加载页面时，它将加载原始内容，因此不会加载您的点击事件代码。

您可以做的是在页面加载时手动触发点击事件。

例子

jQuery('#block-block-23 li a').trigger('click');

完整代码

jQuery(document).ready(function()
{
    jQuery('#block-block-23 li a').click(function(e)
    {
        e.preventDefault();
        jQuery('#block-block-23 li a').addClass("selected");
    });

    jQuery('#block-block-23 li a').trigger('click');
});

优化代码

jQuery("#block-block-23 li a[href='+location.pathname+']").each(function()
{