`
shuai1234
  • 浏览: 972163 次
  • 性别: Icon_minigender_1
  • 来自: 山西
社区版块
存档分类
最新评论

对象数组排序,利用jquery

 
阅读更多
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
  2.   
  3. <html>  
  4.   <head>  
  5.     <title>jQuery数组和字符串--对象数组排序</title>  
  6.     <script type="text/javascript" src="../jquery-1.3.2.min.js"></script>  
  7.   
  8.     <script type="text/javascript">  
  9.   
  10.     <!--  
  11.     $(  
  12.         function()  
  13.         {  
  14.             var students =[  
  15.                 {'sid':'ST001','sname':'张三','sage':18},  
  16.                 {'sid':'ST004','sname':'赵六','sage':23},  
  17.                 {'sid':'ST002','sname':'李四','sage':42},  
  18.                 {'sid':'ST003','sname':'王五','sage':35}  
  19.             ];  
  20.             //表格显示  
  21.             $.each(students,  
  22.                 function(index, value)  
  23.                 {  
  24.                     $('#ia').append('<tr><td>' + value.sid +   
  25.                         '</td><td>' + value.sname +   
  26.                         '</td><td>' + value.sage + '</td></tr>');  
  27.                 }  
  28.             );  
  29.             //按照SID排序  
  30.             var sidOrder = students.sort(  
  31.                 function(a, b)  
  32.                 {  
  33.                     if(a.sid < b.sid) return -1;  
  34.                     if(a.sid > b.sid) return 1;  
  35.                     return 0;  
  36.                 }  
  37.             );  
  38.             $.each(sidOrder,  
  39.                 function(index, value)  
  40.                 {  
  41.                     $('#ib').append('<tr><td>' + value.sid +  
  42.                         '</td><td>' + value.sname +   
  43.                         '</td><td>' + value.sage + '</td></tr>')  
  44.                 }  
  45.             );  
  46.             //按照SAGE排序  
  47.             var sageOrder = students.sort(  
  48.                 function(a, b)  
  49.                 {  
  50.                     return (a.sage - b.sage);  
  51.                 }  
  52.             );  
  53.             $.each(sageOrder,  
  54.                 function(index, value)  
  55.                 {  
  56.                     $('#ic').append('<tr><td>' + value.sid +  
  57.                         '</td><td>' + value.sname +   
  58.                         '</td><td>' + value.sage + '</td></tr>')  
  59.                 }  
  60.             );  
  61.         }  
  62.     );  
  63.     //-->  
  64.     </script>  
  65.   </head>  
  66.   <body>  
  67.     <h5>未排序对象数组:</h5>  
  68.     <table id='ia' border="1"></table>  
  69.   
  70.     <h5>按照SID排序对象数组:</h5>  
  71.     <table id='ib' border="1"></table>  
  72.   
  73.     <h5>按照SAGE排序对象数组:</h5>  
  74.     <table id='ic' border="1"></table>  
  75.   
  76.   </body>  
  77. </html>
分享到:
评论

相关推荐

    JQuery页面数据排序

    本文将深入探讨如何利用jQuery实现页面数据的排序,以及与之相关的源码和工具。 首先,了解jQuery的核心概念是必要的。jQuery是一个轻量级、高性能的JavaScript库,它通过简洁的语法封装了HTML文档遍历、事件处理、...

    js对象数组按属性快速排序

    在本例中,快速排序被用于对JavaScript中的对象数组进行排序。 2. 基于属性或函数的排序方法: sortBy函数允许开发者通过属性名或自定义函数作为排序依据。如果传递的是字符串,则表示按对象的某个属性进行排序;...

    jQuery中json对象的复制方式介绍(数组及对象)

    如果需要对对象数组进行排序,需要在比较函数中指定对象的哪个属性用于排序。例如: ```javascript json2.sort(function(a, b) { return a["requiredColumn"]["crimeTime"] &gt; b["requiredColumn"]["crimeTime"] ? ...

    jquery div排序 高效率

    最后,为了确保代码的可维护性和扩展性,我们应该遵循良好的编程实践,如编写清晰的注释,模块化代码,以及利用jQuery的链式操作。同时,使用最新的jQuery版本,因为每个新版本通常都包含性能改进和bug修复。 总结...

    jQuery插件集之(table排序)各种排序+Demo

    插件可能会利用原生JavaScript的数组方法如`sort()`,并可能采用了分页或懒加载策略,以提高用户体验。 7. **自定义排序规则** 高级插件可能允许用户自定义排序规则,比如基于特定逻辑或自定义比较函数。 8. **...

    9种jquery纯页面分页排序

    这个文件可能包含了一个JSON对象数组,用于存储和传递分页数据。在使用jQuery分页插件时,通常会将后台返回的JSON数据解析成JavaScript对象,然后传递给分页插件进行渲染。 7. **插件使用步骤**: - 引入jQuery库...

    javascript 拖曳排序 jquery插件

    总结来说,`javascript 拖曳排序 jquery插件` 提供了一种便捷的方式来实现用户友好的拖放排序功能,利用 jQuery 的强大功能简化了编码过程。通过 `dragdrop.js` 插件,你可以轻松地在网页上添加这一功能,同时通过...

    利用jQuery对无序列表排序的简单方法

    利用jQuery对无序列表排序的原理是:获取到无序列表中的所有列表项,并转成数组形式,使用JavaScript函数对其进行排序后再次输出。其中使用到的jQuery函数有ready()、get()、text()、each()、append()和JavaScript...

    jquery可任意拖动排序的导航图片效果`

    在本项目中,我们探讨的是如何利用jQuery实现一个可任意拖动排序的导航图片效果,这通常涉及到前端开发中的互动元素设计,特别是与用户交互的部分。 首先,要创建这样的效果,我们需要理解jQuery中的`draggable()`...

    jQuery排序

    尽管描述部分并未提供有效的信息,但从标题及标签中可以明确得知本文旨在探讨如何利用jQuery库实现元素或数据的排序功能。下面将深入讲解jQuery排序的相关知识点。 ### jQuery简介 jQuery是一款流行的JavaScript库...

    jQuery仿Excel表格列表排序代码.zip

    例如,如果数据存储在JavaScript对象数组中,我们可以先获取到被点击的列名,然后根据这个列名对数组中的每个对象进行排序。 ```javascript function sortTable(column, isAscending) { var tableData = ...; // ...

    js排序

    在实际开发中,我们还会遇到对复杂对象数组的排序需求,这时比较函数需要根据对象的某个属性进行比较。例如,如果有一个人数组,按年龄排序: ```javascript function compareByAge(a, b) { return a.age - b.age;...

    jQuery实现合并/追加数组并去除重复项的方法 原创

    在jQuery中,尽管`$.inArray()`是处理数组的一个方便工具,但处理数组的更复杂操作,如排序、过滤或映射,通常我们会直接使用JavaScript原生的数组方法,如`concat()`(合并数组)、`filter()`(过滤数组)或`map()`...

    jQuery动态表格数据分页检索排序代码.zip

    本篇将详细讲解如何利用jQuery实现动态表格的数据分页、检索和排序。 首先,`index.html`是项目的主要入口文件,它通常包含了HTML结构,其中包含表格元素以及用于触发分页、检索和排序事件的按钮或链接。表格一般...

    修改后的 jquery模拟字母顺序排序定位城市列表方法

    本文将详细探讨如何利用jQuery实现“修改后的字母顺序排序定位城市列表”这一功能,以提高用户的查询效率和整体体验。 首先,我们要理解这个功能的基本需求:创建一个城市列表,用户可以通过字母顺序快速定位到他们...

    jquery模拟字母顺序排序定位城市列表方法

    这些数据可以是JSON对象数组,每个对象包含城市名称。例如: ```javascript var cities = [ {name: '北京'}, {name: '上海'}, ... ]; ``` 2. **排序城市**:使用`Array.prototype.sort()`函数,结合`String....

    非常酷的jquery图片排序过筛选滤效果

    本项目名为“非常酷的jQuery图片排序过筛选滤效果”,是一个利用jQuery实现的动态图片分类和排序的交互功能。这个功能在网页设计中尤其受欢迎,因为它能为用户提供直观且友好的体验,尤其是在展示大量图片的场合。 ...

    collectjs是一个用于在JavaScript中处理数组和对象库

    `collect.js` 是一个轻量级的JavaScript库,专门为处理数组和对象而设计。这个库的主要目的是提供一种高效、便捷的方式来操作数据集合,它借鉴了Laravel框架中的Collections API,使得开发者在JavaScript环境中也能...

    jQuery帮助文档

    2. **利用缓存jQuery对象**:多次使用相同的DOM选择时,先存储结果以提高性能。 3. **批量操作**:一次性修改多个元素,而不是逐个修改,如`$("li").addClass("active")`。 4. **使用事件委托**:对于动态添加的元素...

Global site tag (gtag.js) - Google Analytics