使用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.