Jquery排序

最新推荐文章于 2023-04-08 08:17:59 发布

iteye_14170

最新推荐文章于 2023-04-08 08:17:59 发布

阅读量143

点赞数

文章标签： javascript xhtml ViewUI

本文链接：https://blog.csdn.net/iteye_14170/article/details/82617899

版权

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script src="jquery-1.8.3.js"></script>
<script type="text/javascript">

/**
 * 车龄排序,
 * 0降序，1升序
 */
function clSort(arr,flag){
	arr.sort(function(a, b) {
		if(flag == 1) {
			return a - b;
		} else {
			return b - a;
		}
	});
}

function appendStr(sArr,dArr,str){
	$(sArr).each(function() {
		dArr.push(this + str);
	});
}
$(function() {
    $('.sort').click(function(e) {

		var year = [], month = [];

		//把年月分开
		$('.cl').each(function() {
            var txt = $(this).text();
            if (txt.substring(txt.length - 1, txt.length) == '年') {
				year.push(txt.substring(0, txt.length - 1));
            } else {
				month.push(txt.substring(0, txt.length - 1));
            }
        });

		var resultArr = [];
		if ($('#sortDir').val() == '' || $('#sortDir').val() == 'undefined' || $('#sortDir').val() == 'asc') {
        	clSort(year,0);
			clSort(month,0);
			appendStr(year,resultArr,'年');
			appendStr(month,resultArr,'月');
			$('#sortDir').val('desc');
        } else {
			clSort(year,1);
			clSort(month,1)
			appendStr(month,resultArr,'月');
			appendStr(year,resultArr,'年');
			$('#sortDir').val('asc');
        }
		var children = [];
		$(resultArr).each(function() {
            var res = this;
			$('.cl').each(function(){
				if($(this).text() == res){
					children.push($(this).parents("div.sj_zscar_box"));
				}
			})        
		});

		$('#main').children().remove();
        $('#main').append(children);  
    });

});
</script>
</head>

<body>
<div style="cursor:pointer;" class="sort">排序</div>
<div id="main">
  <div class="sj_zscar_box" id="test1">
    <p class="sj_zscar_img">
    <p class="sj_zscar_name"><a href="${ctx}/vehiclepub/view/${obj.id}">奥迪</a></p>
    <ul class="sj_zscar_info">
      <li>当前价格：<span class="sj_zscar_jg">100万元</span></li>
      <li class="cl">1年</li>
    </ul>
  </div>
  <div class="sj_zscar_box" id="test2">
    <p class="sj_zscar_img">
    <p class="sj_zscar_name"><a href="${ctx}/vehiclepub/view/${obj.id}">奥迪</a></p>
    <ul class="sj_zscar_info">
      <li>当前价格：<span class="sj_zscar_jg">100万元</span></li>
      <li class="cl">2年</li>
    </ul>
  </div>
  <div class="sj_zscar_box" id="test3">
    <p class="sj_zscar_img">
    <p class="sj_zscar_name"><a href="${ctx}/vehiclepub/view/${obj.id}">奥迪</a></p>
    <ul class="sj_zscar_info">
      <li>当前价格：<span class="sj_zscar_jg">100万元</span></li>
      <li class="cl">3年</li>
    </ul>
  </div>
  <div class="sj_zscar_box" id="test4">
    <p class="sj_zscar_img">
    <p class="sj_zscar_name"><a href="${ctx}/vehiclepub/view/${obj.id}">奥迪</a></p>
    <ul class="sj_zscar_info">
      <li>当前价格：<span class="sj_zscar_jg">100万元</span></li>
      <li class="cl">1月</li>
    </ul>
  </div>
  <div class="sj_zscar_box" id="test5">
    <p class="sj_zscar_img">
    <p class="sj_zscar_name"><a href="${ctx}/vehiclepub/view/${obj.id}">奥迪</a></p>
    <ul class="sj_zscar_info">
      <li>当前价格：<span class="sj_zscar_jg">100万元</span></li>
      <li class="cl">2月</li>
    </ul>
  </div>
</div>
<input type="text" id="sortDir"/>
</body>
</html>

iteye_14170

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Jquery排序

[code="java"]Untitled Document/** * 车龄排序, * 0降序，1升序 */function clSort(arr,flag){ arr.sort(function(a, b) { if(flag == 1) { return a - b; } else { return b - a;...
复制链接

扫一扫