0

我在论坛上找到了这个 jQuery 代码:http: //jsfiddle.net/nZLpk/8/ 但是,如果我将代码更改为这个http://jsfiddle.net/c5LTj/(修改$(this).css({'font-weight': 'bold', 'border-left': '5px solid #555554'});边框甚至会保留在链接上如果那不是选定的...请帮助。谢谢!

4

4 回答 4

2

我很欣赏回答问题的人正在回答真正的问题(“我如何修复这个确切的代码以便出现我的预期结果?”),但我会借此机会指出一种不同的方法。

你应该简单地用 CSS 定义一个类来封装你需要发生的所有事情,然后addClass()removeClass(). 处理删除的一种经典方法甚至不是跟踪要从哪个元素中删除它,而是在重新应用到仅必要的元素之前将其从 ALL 中删除(我刚刚注意到或多或少是现有代码正在做的事情) ,除了样式而不是类)。

$(document).ready(function(){
    $('.atags').click(function(){
        $('.atags').removeClass('selected');
        $(this).addClass('selected');
    });
});
于 2012-07-01T05:28:09.167 回答
2

您必须以与重置它们的方式相同的方式重置border-left所有具有类的元素:atagfont-weight

$(document).ready(function(){
    $('.atags').click(function(){
        $('.atags').css({"font-weight":"300", 'border-left': '0'});
        $(this).css({'font-weight': 'bold', 'border-left': '5px solid #555554'});
    });
});

http://jsfiddle.net/c5LTj/1/

如果您只想更改颜色,如您在下面的评论中所说:

$('.atags').css({"font-weight":"300", 'border-left-color': '#555554'});
$(this).css({'font-weight': 'bold', 'border-left-color': '#eee'});

如果您删除showonlyone和内联href="javascript:showonlyone实例,您还可以大大改进您的代码,并showonlyone在您更改链接外观的同一位置完成工作。

于 2012-07-01T05:22:38.300 回答
0

因为您需要在应用粗体样式之前添加border-left到应用到所有.atags元素的 css。

$(document).ready(function(){
    $('.atags').click(function(){
        $('.atags').css({'font-weight': '300', 'border-left': '0px'});
        $(this).css({'font-weight': 'bold', 'border-left': '5px solid #555554'});
    });
});

我建议使用 CSS 类而不是直接在代码中指定样式,而不是在 HTML 属性中使用 JavaScript:http: //jsfiddle.net/c5LTj/3/

于 2012-07-01T05:35:14.627 回答
0

你没有重置边界,

 $('.atags').click(function(){
        $('.atags').css({"font-weight":"300", "border-left":0});
        $(this).css({'font-weight': 'bold', 'border-left': '5px solid #555554'});

})

应该可以正常工作

于 2012-07-01T05:25:35.123 回答