使用jquery或javascript对div数据进行排序
我试图用不同的方式对一些DIV进行排序，我很遗憾。 我一直在尝试一些东西，但我不知道如何让它工作。 我有以下格式的div数据。 我有一个下拉列表，其中包括按价格，距离和创建日期等排序选项。在从下拉列表中选择一个optin时，divs数据应该相应地进行排序和显示。 例如，我选择按价格排序，然后数据应按排序顺序显示，价格从低到高开始。
我需要你的指导。
120 2012-05-09 20:39:38.0 20 mile 123 2012-05-10 20:39:38.0 30 mile 100 2012-05-11 20:39:38.0 50 mile 124 2012-05-12 20:39:38.0 60 mile 按价格排序的示例：
$('#content div.price').map(function () { // map sort-value and relevant dom-element for easier handling return {val: parseFloat($(this).text(), 10), el: this.parentNode}; }).sort(function (a, b) { // a simple asc-sort return a.val - b.val; }).map(function () { // reduce the list to the actual dom-element return this.el; }).appendTo('#content'); // < inject into parent node
演示： http ： //jsfiddle.net/QmVsD/1/
几点说明：
- 第一张地图并不是真的需要，但它使排序回调更加简单。
- 你需要为不同的数据类型（例如日期，字符串）提供不同的compare-callbacs
你在那里实际上是一个TABLE，所以使用一个表和一个现有的表分类器。
当你有表格数据时，没有什么可以使用
，这就是你所拥有的。
生成的HTML是演示文稿的一部分，而排序操作是数据模型的一部分。 您应该在代码中分离这两个概念。
在您的情况下，将数据存储在数组（数据模型）中。 当您只想向用户显示数据时，请将其放在div或table html中。 在布局html之前进行排序。 当用户从下拉列表中选择排序选项时，清空#contentContainer ，对数据数组进行排序，重新生成新排序数据的html并将其插入#contentContainer 。
我刚测试了这个，它对我来说很好。 您将决定之后对arrays执行的操作。 🙂
$(document).ready(function () { var priceItems = $('.price'); var arr = new Array(); for (var i = 0; i < priceItems.length;i++) { var tempInt = priceItems[i].innerHTML; tempInt = parseInt(tempInt); arr.push(tempInt); } arr.sort() });
你现在需要的只是使用你的arrays。