JS： （1）点击按钮切换状态

分别按编号和日期进行排序（仅有点击样式切换，无排序效果）：

html:

<div class="sort-options clearfix">
     <div class="option" data-sort=1>编号</div>
     <div class="option" data-sort=0>日期</div>
     <a class="bg-filter" href="options.html">筛选</a>
</div>

CSS:

.sort-options {
	width: 100%;
	height: 0.68rem;
	line-height: 0.68rem;
	background: #b1000c;
}
.sort-options .option{
	width: 2.5rem;
	float: left;
	color: #ffffff;
	text-align: center;
	font-size: 0.28rem;
	color: #fff;
	cursor: pointer;	
	position: relative;
}
.sort-options .option::before, .sort-options .option::after {
	width: 2.5rem;
    height: 0.34rem;
    display: block;
    content: '';
    background-repeat: no-repeat;
    background-size: 0.2rem;
    opacity: 0.7;
}
.sort-options .option::before{
    background-image: url(../imgs/arrow-up.png);
    background-position: 85% 40%;
    position: absolute;
    top: 14%;   
}
.sort-options .option::after{
    background-image: url(../imgs/arrow-down.png);    
    background-position: 85% 60%;
    position: absolute;
    bottom: 18%;
}

JS:

$(".sort-options").on("click", ".option", function(){
    // 将标记转换为数字类型
	var sort = $(this).attr("data-sort") - 0;
    // 按钮升序（sort = 1）和降序（sort = -1）的两种状态
	sort = sort === 1 ? -1 : 1;
    // 三种状态切换时
    /*if(++sort > 1){
		sort = -1;
	}*/
	$(this).attr("data-sort", sort);
	$(this).siblings(".option").attr("data-sort", 0);
})