使用Jquery创建链接粗体

Question

我有两个链接用于排序。一个是Make和一个是模型（两者都是升序和降序）。

现在我有它，所以当你加载页面，你只能看到模型降序和降序。如果您要点击模型降序，可隐藏该链接并显示模型升序的链接。

问：我想使当前选中的列进行排序，使其成为粗体，一旦您点击它。并且一旦选择了另一列，就会解除绑定并重置为原始链接。

HTML：

<a href='#' id='modelD'>Model D</a> 
<a href='#' id='modelA'>Model A</a> 
<a href='#' id='makeD' >Make D</a> 
<a href='#' id='makeA' >Make A</a>​ 

JQUERY：

$('#modelA').hide(); 
$('#makeA').hide(); 

$('#modelD').click(function(){ 
    $('#modelD').hide(); 
    $('#modelA').show(); 
}); 

$('#modelA').click(function(){ 
    $('#modelA').hide(); 
    $('#modelD').show(); 
}); 

$('#makeD').click(function(){ 
    $('#makeD').hide(); 
    $('#makeA').show(); 

}); 

$('#makeA').click(function(){ 
    $('#makeA').hide(); 
    $('#makeD').show(); 
}); 

这里是代码的小提琴。 http://jsfiddle.net/JKFKC/1/

任何帮助表示赞赏。谢谢。

Answer 1

使用本

.css('font-weight', 'bold') 

让你为一起去的联系，如model编写小

$('#modelD, #modelA').click(function() { 
    $('#modelD, #modelA').toggle().css('font-weight', 'bold'); 
    $('[id^=make]').css('font-weight', 'normal'); 
}); 


$('#makeA, #makeD').click(function() { 
    $('#makeA, #makeD').toggle().css('font-weight', 'bold'); 
    $('[id^=model]').css('font-weight', 'normal'); 
}); 

DEMO

Answer 2

定义一个类。然后，当点击一个模型时：

$(".model").css({"font-weight":"normal"}); // un-bold all the model links 
$(this).css({"font-weight":"bold"}); // bold the clicked link.