项目开发过程中，PM说系统只要在一个特定的浏览器中运行就好，但是在其他的浏览器中不能出现逻辑的错误，所以在开发过程中，前端和后台选择是Chrome浏览器，没有仔细测试Firefox和IE。但是昨天PM反映了一个bug，是浏览器兼容性bug，在Chrome浏览器下工作正常，但是在IE浏览器不报错，但是逻辑是不对的。剔除复杂的业务逻辑，代码精简如下：

<html>

    <head>

        <meta charset="utf-8"/>

        <script type="text/javascript" src="jquery-1.10.2.min.js"></script>

        <script type="text/javascript" src="underscore.js"></script>

    </head>

    <body>

        <input type="hidden" value="" id="tempids"/>

        <input type="text" value="" id="tempvalue"/>

        <script type="text/javascript">

        var arr1=$("#tempids").val().split(",");

        var arr2=[4,5,6];

        $("#tempvalue").val($.unique($.merge(arr1,arr2)).join(","));

        var selectedFilterIds = $("#tempvalue").val();

        if (selectedFilterIds.split(",")[0] == "")

        {

            alert("选择结果为空!");

        }

        else{

            alert("有数据!");

        }

        </script>

    </body>

</html>

程序的目的，是把arr2合并到arr1中，然后对数组进行去重操作。错误就是在去重操作上，我们使用jQuery.unique()。jQuery.unique()方法在Chrome和IE浏览器中输出的结果不相同。看下面示例：

var temp=$.unique([1,2,3,3,2,1,4]);

        for(var j=0;j<temp.length;j++){

            console.log(temp[j]);

        }

在Chrome中输出结果是：4 3 2 1；但是在IE下输出的结果是：2 3 2 1 4。结果不一样。在参考网址的stack overflow有解释。不过我们用错了unique()这方法。

注意：删除数组中的重复元素。只处理删除DOM元素数组，而不能处理字符串或数字数组。

要处理字符串或数字数组，我们可以借助UnderScore.js类库里面的uniq()方法。代码如下：

var temp=_.uniq([1,2,3,3,2,1,4]);

for(var j=0;j<temp.length;j++){

       console.log(temp[j]);

}

输出结果在Chrome和IE下都是相同的。1,2,3，4.

参考网址：

jQuery.unique()方法：http://www.css88.com/jqapi-1.9/jQuery.unique/

UnderScore.js里面的uniq()方法：http://www.css88.com/doc/underscore/#uniq

Stack Overflow:http://stackoverflow.com/questions/7366095/how-to-use-unique-function

jQuery.unique引发一个血案的更多相关文章

  1. jQuery版本引发的血案 iframe error 和 checkbox 无法勾选

    问题介绍: 1.由于我们的项目里面用了很多Iframe,在初始话加载的时候页面就会报错.一开始调试很久没找到什么原因,看打印结果页面会被两次load,只能一步步找, 最后发现在document rea ...

  2. 一个由正则表达式引发的血案 vs2017使用rdlc实现批量打印 vs2017使用rdlc [asp.net core 源码分析] 01 - Session SignalR sql for xml path用法 MemCahe C# 操作Excel图形——绘制、读取、隐藏、删除图形 IOC,DIP,DI,IoC容器

    1. 血案由来 近期我在为Lazada卖家中心做一个自助注册的项目,其中的shop name校验规则较为复杂,要求:1. 英文字母大小写2. 数字3. 越南文4. 一些特殊字符,如“&”,“- ...

  3. Replication的犄角旮旯（六）-- 一个DDL引发的血案(上)（如何近似估算DDL操作进度）

    <Replication的犄角旮旯>系列导读 Replication的犄角旮旯(一)--变更订阅端表名的应用场景 Replication的犄角旮旯(二)--寻找订阅端丢失的记录 Repli ...

  4. Replication的犄角旮旯（七）-- 一个DDL引发的血案(下)（聊聊logreader的延迟）

    <Replication的犄角旮旯>系列导读 Replication的犄角旮旯(一)--变更订阅端表名的应用场景 Replication的犄角旮旯(二)--寻找订阅端丢失的记录 Repli ...

  5. 转：一个Sqrt函数引发的血案

    转自:http://www.cnblogs.com/pkuoliver/archive/2010/10/06/1844725.html 源码下载地址:http://diducoder.com/sotr ...

  6. 一个Sqrt函数引发的血案(转）

    作者: 码农1946  来源: 博客园  发布时间: 2013-10-09 11:37  阅读: 4556 次  推荐: 41   原文链接   [收藏]   好吧,我承认我标题党了,不过既然你来了, ...

  7. 一个字母引发的血案 java.io.File中mkdir()和mkdirs()

    一个字母引发的血案 明天开始放年假了,临放假前有个爬虫的任务,其中需要把网络图片保存到本地,很简单,马上写完了代码: //省略部分代码... Long fileId= (Long) data.get( ...

  8. 一个无锁消息队列引发的血案（六）——RingQueue(中) 休眠的艺术 [续]

    目录 (一)起因 (二)混合自旋锁 (三)q3.h 与 RingBuffer (四)RingQueue(上) 自旋锁 (五)RingQueue(中) 休眠的艺术 (六)RingQueue(中) 休眠的 ...

  9. 一个无锁消息队列引发的血案（五）——RingQueue(中) 休眠的艺术

    目录 (一)起因 (二)混合自旋锁 (三)q3.h 与 RingBuffer (四)RingQueue(上) 自旋锁 (五)RingQueue(中) 休眠的艺术 (六)RingQueue(中) 休眠的 ...

随机推荐

  1. python实现简单爬虫功能

    在我们日常上网浏览网页的时候,经常会看到一些好看的图片,我们就希望把这些图片保存下载,或者用户用来做桌面壁纸,或者用来做设计的素材. 我们最常规的做法就是通过鼠标右键,选择另存为.但有些图片鼠标右键的 ...

  2. c和oc小知识

    1.const const 修饰了*p1 / *p2 const int * p1=&age; int const * p2=&age;//和上面的意义一样 ,换句话说就是 在 “ * ...

  3. 快速理解-Ajax

    AJAX即“Asynchronous JavaScript and XML”,意思是异步JavaScript和XML,是指一种创建交互式网页的网页开发技术. 虽然现在很少有人去自己手动写AJAX,大多 ...

  4. 对Hibernate的理解

    ---恢复内容开始--- 一.面向对象设计的软件内部运行过程可以理解成就是不断创建各种新对象,建立对象之间的关系,调用对象的方法来改变各个对象的状态和对象消亡的过程.不管程序运行的过程和操作怎么样,本 ...

  5. webScoket的浅短的认识

    在一般的发送数据请求的时候都是用的http协议,但是对于类似即时聊天,需要客户端与服务器不间断的交互的时候对于http协议来说就不太适用了.因为http协议无法主动把数据发到客户端,而且客户端发送请求 ...

  6. 复习排序with javascript

    最近又翻看了一下数据结构(数据结构学渣). 以前总是看不懂,连冒泡和选择排序都要纠结半天,后来才慢慢有意识能区分开来. 当真的理解了快速排序之后,才觉得,这是个很赞的排序,很容易理解. 于是简单的,模 ...

  7. Java 清除数组相同元素

    定义一个函数清除该数组的重复元素,返回一个不能浪费长度的数组.代码如下: import java.util.*; public class demo1 { public static void mai ...

  8. python 中使用 global 引发了莫名其妙的问题

    哪里出问题了 python 中,使用 global 会将全局变量设为本函数可用.同时,在函数内部访问变量会先本地再全局. 在嵌套函数中,使用 global 会产生不合常理的行为. 上代码: In [9 ...

  9. POJ1026 Cipher（置换的幂运算）

    链接:http://poj.org/problem?id=1026 Cipher Time Limit: 1000MS   Memory Limit: 10000K Total Submissions ...

  10. console对象-转

    console对象 来自<JavaScript 标准参考教程(alpha)>,by 阮一峰 目录 开发者工具 console对象 console.log() console.debug() ...