jQuery.unique引发一个血案
项目开发过程中,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引发一个血案的更多相关文章
- jQuery版本引发的血案 iframe error 和 checkbox 无法勾选
问题介绍: 1.由于我们的项目里面用了很多Iframe,在初始话加载的时候页面就会报错.一开始调试很久没找到什么原因,看打印结果页面会被两次load,只能一步步找, 最后发现在document rea ...
- 一个由正则表达式引发的血案 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. 一些特殊字符,如“&”,“- ...
- Replication的犄角旮旯(六)-- 一个DDL引发的血案(上)(如何近似估算DDL操作进度)
<Replication的犄角旮旯>系列导读 Replication的犄角旮旯(一)--变更订阅端表名的应用场景 Replication的犄角旮旯(二)--寻找订阅端丢失的记录 Repli ...
- Replication的犄角旮旯(七)-- 一个DDL引发的血案(下)(聊聊logreader的延迟)
<Replication的犄角旮旯>系列导读 Replication的犄角旮旯(一)--变更订阅端表名的应用场景 Replication的犄角旮旯(二)--寻找订阅端丢失的记录 Repli ...
- 转:一个Sqrt函数引发的血案
转自:http://www.cnblogs.com/pkuoliver/archive/2010/10/06/1844725.html 源码下载地址:http://diducoder.com/sotr ...
- 一个Sqrt函数引发的血案(转)
作者: 码农1946 来源: 博客园 发布时间: 2013-10-09 11:37 阅读: 4556 次 推荐: 41 原文链接 [收藏] 好吧,我承认我标题党了,不过既然你来了, ...
- 一个字母引发的血案 java.io.File中mkdir()和mkdirs()
一个字母引发的血案 明天开始放年假了,临放假前有个爬虫的任务,其中需要把网络图片保存到本地,很简单,马上写完了代码: //省略部分代码... Long fileId= (Long) data.get( ...
- 一个无锁消息队列引发的血案(六)——RingQueue(中) 休眠的艺术 [续]
目录 (一)起因 (二)混合自旋锁 (三)q3.h 与 RingBuffer (四)RingQueue(上) 自旋锁 (五)RingQueue(中) 休眠的艺术 (六)RingQueue(中) 休眠的 ...
- 一个无锁消息队列引发的血案(五)——RingQueue(中) 休眠的艺术
目录 (一)起因 (二)混合自旋锁 (三)q3.h 与 RingBuffer (四)RingQueue(上) 自旋锁 (五)RingQueue(中) 休眠的艺术 (六)RingQueue(中) 休眠的 ...
随机推荐
- 【总结】C# 设置委托的机理和简要步骤
[引语]实际上,和Winform打交道的第一天呢,我们就已经接触了委托,例如当双击button产生button1_click,这个呢,是对button1点击事件的处理方法,至于委托和订阅事件,就悄悄的 ...
- 一、JSP、servlet、SQL三者之间的数据传递(前台与后台数据交互)
背景: 目前业界很流行的MVC(model-view-control)开发模式,理解为 模型是Bean, 视图是 Html/Jsp, 控制是Servlet, 关联数据库的Dao web的运行机制: 数 ...
- Unity3D 脚本手册
1.private Ray ray; --定义射线 ray = Camera.main.ScreenPointToRay(Input.mousePosition); --摄像机发出的射线投射鼠标到 ...
- Android之Json的学习
json数据包含json对象,json数组,对象是{ },数组是[ ], 数组里面还可以包含json对象,json对象之间是用逗号(,)隔开 形式如下: { "languages" ...
- 串口实现FIFO接受数据
基本原理:静态队列 /* * 串口的FIFO简单读取实现 * 功能,实现串口的FIFO实现 * 使用方法: * 版本:v1.0.0 * */ #include "sys.h" #i ...
- reconnectingwebsocket.js
// MIT License: // // Copyright (c) 2010-2012, Joe Walnes // // Permission is hereby granted, free o ...
- Xcode 改时间问题 lua代码没反应问题
Xcode 改时间问题 rm -fr $_TARGET_BUILD_CONTENTS_PATH/$1/*
- HDU1039-Easier Done Than Said?(字符串处理)
一,题意: 判断三个条件 1:有元音字母 2:不能三个连续元音或辅音 3:不能连续两个相同的字母,除非ee或oo二,思路 写函数一个条件一个条件去判断 #include<iostream> ...
- HTML 常用标签
一.基础标签 <!-- --> 定义注释 <!DOCTYPE> 定义文档类型 <style> 定义文档的样式信息 <meta> 定义关于HTML文 ...
- java多线程系类:JUC原子类:01之框架
本系列内容全部来自于http://www.cnblogs.com/skywang12345/p/3514589.html 特在此说明!!!!! 根据修改的数据类型,可以将JUC包中的原子操作类可以分为 ...