我有两个用于排序的链接.一个由Make和一个由Model(升序和降序两者).
现在我拥有它,所以当你加载页面时,你只能看到Model Descending和Make descending.如果你要点击让我们说Model Descending它会隐藏该链接并显示Model Ascending的链接.
问：我想点击它后,将当前选中的列进行排序.并且一旦选择了另一列,就解压缩并重置为原始链接.
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/
任何帮助表示赞赏.谢谢.
解决方法
用这个
.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');
});
DEMO