单击时将活动状态添加到超链接

我在尝试向我的链接添加活动状态时遇到了一些问题。这个我摆弄代码：单击时将活动状态添加到超链接

$(function() { 

    $('a').click(function() { 
     $(this).addClass('PnavCurrent'); 
     //$("div a").removeClass("PnavCurrent"); 
     //$("div a[href="+newHash+"]").addClass("PnavCurrent"); 

     $(this).removeClass('PnavCurrent'); 
     $(this).css('color', '#51ad9d'); 
     $(this).css('z-index', '2'); 
     $(this).css('border-color', '#00a8ff'); 

     $('a').hover($(this).css('z-index', '10')); 
    }); 
});

出于某种原因，它不会对链接应用CSS活动状态类（“PnavCurrent”），但是当我在脚本代码指定它它不正常工作{$(this).css...}。现在我想的是，在添加一个悬停状态的z-index在脚本代码的链接，这样的事情：

$('a').hover($(this).css ('z-index', '10'));

我试图使用的代码有点堵在上面努力实现这一目标但它不起作用。我将不胜感激，如果任何人都可以提供帮助，并可能是一个更好的解决方案。

来源

2012-07-20 spencer

您正在添加，然后删除班级'PnavCurrent' – 2012-07-20 01:05:37

CSS：

.PnavCurrent { 
    color: #51ad9d; 
    z-index: 2; 
    border-color: #00a8ff; 
} 

.PnavCurrent:hover { z-index: 10; }

的Javascript：

$(function() { 
    $('a').click(function(e) { 
     // you usually want to prevent default for handling link clicks, 
     // otherwise the browser follows the href (if that's intended skip this) 
     e.preventDefault(); 

     $('a').not(this).removeClass('PnavCurrent'); 
     $(this).addClass('PnavCurrent'); 
    }); 
});

注上jQuery .hover()：你不需要这个在这里的所有，但用法会是这样（这是一个替代至css :hover规则，不一起使用）

$("a").hover(
    function() { 
     $(this).css('z-index',2)); 
    }, 
    function() { 
     $(this).css('z-index', 10); 
    } 
);

来源

2012-07-20 01:40:17 nbrooks

对不起，很长的响应时间。我认为我的CSS中的某些内容与此脚本冲突，因为当我从头开始测试新文件（html和css）时，它可以工作，但有一些问题，例如它不记得我的链接在页面重新加载时的活动状态等。有用。非常感谢nbrooks。你一直是一个非常大的帮助，我很欣赏它。 – spencer 2012-07-20 20:26:38

单击时将活动状态添加到超链接

回答

相关问题