我有一组用于排序的链接,例如。类别,名称,日期以及另一组升序/降序。最初当页面加载时,这些都不会被选中,结果也不会是任何顺序。当做出选择时,我需要为两个组都有值,即。 sortby和sortorder。
例如,如果用户选择按“类别”排序,则以下功能将使用ASC作为默认排序方向。然后我还需要通过在链接中添加“selected”类来突出显示与data-option-value =“asc”的链接。
有人可以帮忙吗?
$('.sort a').click(function(e) {
var $this = $(this);
// Turn 'selected' class on/off
if ($this.hasClass('selected'))
return false;
$this.parents('.sort-set').find('.selected').removeClass('selected');
$this.addClass('selected');
if($('.sortKey a.selected').attr('data-option-value')){
key = $('.sortKey a.selected').attr('data-option-value');
} else {
var key = 'date';
//.addClass('selected'); HOW TO DO THIS??
}
if($('.sortOrder a.selected').attr('data-option-value')){
order = $('.sortOrder a.selected').attr('data-option-value');
} else {
var order = "asc";
//.addClass('selected'); HOW TO DO THIS??
}
$container.isotope({sortBy: valBy, sortAscending: valAscending});
return false;
});
<div class="option-combo sort">
<ul class="sort sort-set clearfix sortKey">
<li><a href="#" data-option-value="name">Name</a></li>
<li><a href="#" data-option-value="category">Category</a></li>
<li><a href="#" data-option-value="date">Expiry Date</a></li>
</ul>
</div>
<div class="option-combo sort">
<ul class="sort sort-set clearfix sortOrder">
<li><a href="#" data-option-value="asc">Ascending</a></li>
<li><a href="#" data-option-value="desc">Descending</a></li>
</ul>
</div>
答案 0 :(得分:2)
您可以在选择器中使用属性值:
$("element[attribute='value']").addClass('selected')
根据您的评论,您可能需要执行以下操作:
$("a[data-option-value='asc']", ".sortOrder").addClass('selected')