我有两个用于排序的链接。一个是品牌,一个是型号(两者都是升序和降序)。
现在我有它,所以当您加载页面时,您只能看到模型降序和制作降序。如果您要单击假设模型降序,它会隐藏该链接并显示模型升序的链接。
问:我想让当前选择的排序列在您单击后变为粗体。并在选择另一列后取消加粗并重置为原始链接。
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();
});
这是代码的 fiddle 。 http://jsfiddle.net/JKFKC/1/
感谢任何帮助。谢谢。
最佳答案
用这个
.css('font-weight', 'bold')
让你的代码更小
$('#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');
});
关于javascript - 使用 Jquery 单击时使链接加粗,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11019682/