繁體中文当前位置: 首页 > 图文教程 > 网络编程 > Javascript > javascript Array.sort() 跨浏览器下需要考虑的问题
- Javascript
- 颜色变换 像字符逐字输入的欢迎词
- CSS 伪类实现的鼠标滑动图片链接
- 百度用到的Js日历 大家可以看看
- CSS 渐变背景的6个演示代码
- Jquery 弹出层插件实现代码
- Javascript 模式实例 观察者模式
- [原创]javascript 指定区域内图片等比例缩放实现代码 脚本之家整合版
- javascript window对象属性整理
- JavaScript弹簧振子超简洁版 完全符合能量守恒,胡克定理
- WEB页子窗口(showModalDialog和showModelessDialog)使用说明
- 用JavaScript实现 铁甲无敌奖门人 “开口中”猜数游戏
- 理解 JavaScript 预解析
- 理解JavaScript变量作用域更轻松
- JavaScript的变量作用域深入理解
- javascript写的一个链表实现代码
- Js 打字效果 逐一出现的文字
- javascript 走马灯效果的链接提示
- CSS 动态链接提示
- JavaScript 事件的一些重要说明
- JavaScript 三种不同位置代码的写法
Javascript 中的 javascript Array.sort() 跨浏览器下需要考虑的问题
出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2010-01-10 浏览: 304 ::
收藏到网摘: n/a
最近组里项目需要一个简单的Table排序的功能，这个功能实现起来很简单，并且网上也有很多现成的代码，因此任务很快完成。 然而在做跨浏览器的测试时在chrome浏览器下发现了一个问题，测试人员发现(见图1)，在chrome下依据某列排序时，如果两行的排序数值相同，chrome不是按通常情况保持这两列的顺序不变，而是将他们顺序调换。在google一下问题之后，我们发现原来是当初ECMAscript规范中并未规定具体的sort算法，所以导致各个浏览器都有自己的sort算法，然而由于有些厂商是基于不稳定的排序算法实现的，如chrome和Mozilla/Firefox 3.0以前的排序算法都是不稳定的，不过IE是稳定的排序算法。这种算法实现的差异也导致了图表在不同浏览器下显示的结果不一致。
图1：数组左边的数字表示它初始化时候的顺序
思考了一下，我和组里另外一个成员分别给出了自己的解决方法，他的意见是通过自己实现具体的sort算法来统一控制，鉴于网上的现成的排序算法很多并且排序算法是程序员的基础，这种方式实现起来并不复杂，唯一的工作就是代码的实现。不过我认为其实有更简单的方法，因为我们的数据是基于XSLT从xml中解析出来的，而XSLT是知道每行数据的的序号的(当然如果是由服务器端代码从数据库或webservice读取一样很容易取该值)，所以我认为可以在XSLT中给每列添加一个Index属性，e.g.第一行Index=1,第二行Index=2...这样在sort比较大小的时候如果发现两个数值相同，则比较其行号，这样最终只需要在在比较函数中添加两行代码即可实现。下面是实现代码和结果截图：
复制代码 代码如下:
var array = [
{Index:1,val:25},
{Index:2,val:25},
{Index:3,val:45},
{Index:4,val:78}];
array.sort(function(a, b) {
if (a.val === b.val) {
//此处两值相同，则根据其行号(初始化时的索引值)进行比较。
return a.Index - b.Index;
}
return a.val - b.val;
})
for (var i = 0; i < array.length; i++) {
document.write("<p>" + array[i].Index + ":" + array[i].val + "</p>");
}
更新后结果截图：
当然这只是解决方法之一，我的目的只是尽量减少我们需要维护的代码量，这样可以尽量减少bug。一个思路，希望对你有所帮助。
挫折就像一面墙，这面墙迫使我们向自己证明，我们是多么渴望得到这面墙后面的宝藏
评论 (0) All
