<section class="filtrate_term" id="product_sort" style="width: 100%;">
<ul>
<li class="">最新</li>
<li class="">销量</li>
<li class="">更新</li>
<li class="price" date-type="asc">价格<span class="arrow_up active_up"></span><span class="arrow_down "></span></li>
</ul>
</section>
<div class="index_goods">
<ul>
<li>
<div class="price">12元</div>
</li>
</ul>
<ul>
<li>
<div class="price">22元</div>
</li>
</ul>
<ul>
<li>
<div class="price">33元</div>
</li>
</ul>
</div>
$(function() {
var sortByInput = function(sortBy) {
var sortEle = $('.index_goods>ul').sort(sortBy);
$('.index_goods').empty().append(sortEle);
}
//按价格排序
//parseInt($(a).find('.price_pro').text().replace(/[^0-9]/ig,'')) 获取结果值
var asc = function(a, b) {
return parseInt($(a).find('.price_pro').text().replace(/[^0-9]/ig,'')) > parseInt($(b).find('.price_pro').text().replace(/[^0-9]/ig,'')) ? -1 : 1;
}
var desc = function(a, b) {
return parseInt($(a).find('.price_pro').text().replace(/[^0-9]/ig,'')) > parseInt($(b).find('.price_pro').text().replace(/[^0-9]/ig,'')) ? 1 : -1;
}
$('.price').on('click',function(){
var _type= $(this).attr('date-type');
if (_type =='desc') {
sortByInput(desc);
$(this).attr('date-type','asc');
$('.arrow_up').addClass('active_up');
$('.arrow_down ').removeClass('active_down');
}else{
sortByInput(asc);
$(this).attr('date-type','desc');
$('.arrow_up').removeClass('active_up');
$('.arrow_down ').addClass('active_down');
}
})
// tab切换 class on 下标
$('.filtrate_term li').on('click',function(){
$(this).attr('class','on').siblings('li').attr('class','');
})
})