JS 对象数组Array 根据对象object key的值排序sort
JS 对象数组Array 根据对象object key的值排序sort有个js对象数组 var ary=[{id:1,name:"b"},{id:2,name:"b"}] 需求是根据name 或者 id的值来排序
函数定义:function keysrt(key,desc) {
return function(a,b){
return desc ? ~~(a < b) : ~~(a > b);
}
}
使用:var ary=[{id:1,name:"b"},{id:2,name:"b"}];
ary.sort(keysrt('name',true));
ary.sort(keysrt('name',false));
ary.sort(keysrt('id',false));
Demo Code:<!doctype html>
<html lang="zh-cn">
<head>
<meta charset="utf-8" />
<title>demo</title>
</head>
<body>
<div id="element"></div>
<button onclick="paixu('name',0)">name 正序</button>
<button onclick="paixu('name',1)">name 倒序</button>
<button onclick="paixu('age',0)">age 正序</button>
<button onclick="paixu('age',1)">age 倒序</button>
<button onclick="paixu('time',0)">time 正序</button>
<button onclick="paixu('time',1)">time 倒序</button>
<script src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script>
<script>
var DemoData= [
{name:"A", age:12,"time":'2016年07月04 15:50:11'},
{name:"B", age:90,"time":'2016年07月04 15:40:11'},
{name:"C", age:13,"time":'2016年07月04 15:28:11'},
{name:"D", age:24,"time":'2016年07月04 15:19:11'}
];
function KeySort(key,desc) { // KEY:需要排序的键名 desc:排序类型 true是从大到小 false是反之
return function(a,b){
return desc ? ~~(a < b) : ~~(a > b);
}
}
function paixu(key,desc) {
DemoData.sort(KeySort(key,desc));// 排序处理
// 输出排序后的结果
var $text = "";
$.each(DemoData, function (key, value) {
var $div = "<div>";
$.each(value, function (key, value) {
$div += "<span>" + key + ":" + value + "</span>" + " ";
});
$div += "</div>";
$text = $text + $div;
})
$text += "";
$("#element").html($text);
}
</script>
</body>
</html>
附加:两个对象数组,某一项永远置顶并且排序,Code:<!doctype html>
<html lang="zh-cn">
<head>
<meta charset="utf-8" />
<title>demo</title>
<style type="text/css">
.aa{background: #ccc;}
</style>
</head>
<body>
<div id="element"></div>
<button onclick="paixu('name',0)">name 正序</button>
<button onclick="paixu('name',1)">name 倒序</button>
<button onclick="paixu('age',0)">age 正序</button>
<button onclick="paixu('age',1)">age 倒序</button>
<button onclick="paixu('time',0)">time 正序</button>
<button onclick="paixu('time',1)">time 倒序</button>
<script src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script>
<script>
var Data =[{
"menufolder":[
{"name":"A", "age":"12","time":"2016年07月04 15:50:11","type":"menufolder"},
{"name":"B", "age":"90","time":"2016年07月04 15:40:11","type":"menufolder"},
{"name":"C", "age":"13","time":"2016年07月04 15:28:11","type":"menufolder"},
{"name":"D", "age":"24","time":"2016年07月04 15:19:11","type":"menufolder"}
],
"menufile":[
{"name":"A1", "age":"12","time":"2016年07月04 15:50:11","type":"menufile"},
{"name":"B1", "age":"90","time":"2016年07月04 15:40:11","type":"menufile"},
{"name":"C1", "age":"13","time":"2016年07月04 15:28:11","type":"menufile"},
{"name":"D1", "age":"24","time":"2016年07月04 15:19:11","type":"menufile"}
]
}];
function KeySort(key,desc) { // KEY:需要排序的键名 desc:排序类型 true是从大到小 false是反之
return function(a,b){
return desc ? ~~(a < b) : ~~(a > b);
}
}
function paixu(key,desc) {
var a = Data.menufolder.sort(KeySort(key,desc));// 排序处理
var b = Data.menufile.sort(KeySort(key,desc));// 排序处理
var c=new Array();
var d=c.concat(a,b);
OutputHtml(d);
}
function OutputHtml(Data) {
// 输出排序后的结果
var $text = "";
$.each(Data, function (key, value) {
var $div = "<div>";
if (key % 2 == 0) {
var $div = "<div class=\"aa\">";
}
$.each(value, function (key, value) {
$div += "<span>" + key + ":" + value + "</span>" + " ";
});
$div += "</div>";
$text = $text + $div;
})
$("#element").html($text);
}
paixu('name',0);
</script>
</body>
</html>
页:
[1]