如何使用jQuery从数组中删除特定值


419

我有一个看起来像这样的数组: var y = [1, 2, 3];

我想2从array中删除y

如何使用jQuery从数组中删除特定值?我已经尝试过,pop()但是总是删除最后一个元素。


8
警告:一些最受好评的答案可能会有副作用,例如,当数组不包含要删除的元素时,将执行错误的操作。请小心使用它们
里卡多

这个答案对我
有用

请参阅在splice()和$ .inArray()的使用下的注释,我已经解决了这个问题,而无需使用循环,它很干净。
user253780

Answers:


619

工作中的JSFIDDLE

您可以执行以下操作:

var y = [1, 2, 2, 3, 2]
var removeItem = 2;

y = jQuery.grep(y, function(value) {
  return value != removeItem;
});

结果:

[1, 3]

http://snipplr.com/view/14381/remove-item-from-array-with-jquery/


2
这是个好消息,是的,需要正确的修改:)
Sarfraz 2010年

2
我确实认为@ user113716答案是关于默认JS方法的正确方法。任何本机方法都将始终被优先采用且速度更快。
neoswf 2012年

114
这个答案不是完全错误吗?它正在创建一个缺少项的新数组,而不是从数组中删除项。这些根本不是一回事。
詹姆斯·摩尔

5
这是一个复杂度为O(n)的删除操作…数组中的值越多,它的性能
越差

2
O(n)的复杂性不是问题。
奥马尔·塔里克

370

使用jQuery,您可以执行以下单行操作:

示例: http //jsfiddle.net/HWKQY/

y.splice( $.inArray(removeItem, y), 1 );

使用本机.splice()和jQuery的$.inArray()


13
@Elankeeran-不客气。:o)我应该注意,这只会删除第一个实例。如果有多个要删除的文件,将无法使用。
user113716 2010年

7
我还将removeItem更改为数组中不存在的值,并删除了数组中的最后一项。如果不确定不确定removeItem的存在,请使用此方法:y = $ .grep(y,function(val){return val!= removeItem;});
Solburn 2011年

52
警告-可能会移除错误的物品!$ .inArray如果不存在该值,则返回-1。.splice将负索引视为“从头开始”,因此,如果不存在要删除的值,则将删除其他一些值。$ .grep也会删除所有出现的内容,而此方法只会删除第一个出现的内容。
瑞安·威廉姆斯

1
要解决上述两个问题,请使用如下所示的while循环和临时变量:var found; while ((found = $.inArray(removeItem, y)) !== -1) y.splice(found, 1);

1
尽管使用ES5 .indexOf()而不是jQuery 会更好,因为您可以将找到的最后一个索引用作下一次搜索的起点,这比每次搜索整个数组都有效。var found=0; while ((found = y.indexOf(removeItem, found)) !== -1) y.splice(found, 1);

50

jQuery.filter方法很有用。这可用于Array对象。

var arr = [1, 2, 3, 4, 5, 5];

var result = arr.filter(function(elem){
   return elem != 5; 
});//result -> [1,2,3,4]

http://jsfiddle.net/emrefatih47/ar0dhvhw/

在Ecmascript 6中:

let values = [1,2,3,4,5];
let evens = values.filter(v => v % 2 == 0);
alert(evens);

https://jsfiddle.net/emrefatih47/nnn3c2fo/


4
尽管实际上并没有改变现有的阵列,而是创建了一个新的阵列,但它似乎在所提出的解决方案中发挥了最佳的作用。它也适用于不存在的值或空数组。我在JSFiddle中进行了快速性能检查:使用具有800.000值的数组,大约需要6秒钟才能完成。不确定是否很快。
Flo

2
该解决方案使用香草JS高阶函数过滤器,而不是 jQuery过滤器方法。
卡里马

我喜欢它!这似乎是最好的解决方案,即使它不是jquery ...
Sam

36

您可以使用underscore.js。这确实使事情变得简单。

就您而言,您必须编写的所有代码都是-

_.without([1,2,3], 2);

结果将是[1,3]。

它减少了您编写的代码。


34

不是jQuery方式,而是...为什么不使用更简单的方式。从以下数组中删除“ c”

var a = ['a','b','c','d']
a.splice(a.indexOf('c'),1);
>["c"]
a
["a", "b", "d"]

您还可以使用:(请注意:不要修改您不拥有的对象

Array.prototype.remove = function(v) { this.splice(this.indexOf(v) == -1 ? this.length : this.indexOf(v), 1); }
var a = ['a','b','c'];
a.remove('c'); //value of "a" is now ['a','b']

添加更简单a.push('c')


9
不起作用 如果找不到数组,则删除数组中的最后一项。
蒂莫西·亚伦

7
IE8-不支持indexOf。
Boude 2013年

1
工作完美,谢谢。
Jay Momaya

22

删除数组中的项目

var arr = ["jQuery", "JavaScript", "HTML", "Ajax", "Css"];
var itemtoRemove = "HTML";
arr.splice($.inArray(itemtoRemove, arr), 1);

14
//This prototype function allows you to remove even array from array
Array.prototype.remove = function(x) { 
    var i;
    for(i in this){
        if(this[i].toString() == x.toString()){
            this.splice(i,1)
        }
    }
}

使用例

var arr = [1,2,[1,1], 'abc'];
arr.remove([1,1]);
console.log(arr) //[1, 2, 'abc']

var arr = [1,2,[1,1], 'abc'];
arr.remove(1);
console.log(arr) //[2, [1,1], 'abc']

var arr = [1,2,[1,1], 'abc'];
arr.remove('abc');
console.log(arr) //[1, 2, [1,1]]

要使用此原型函数,您需要将其粘贴到代码中。然后,您可以将其应用于任何带有“点表示法”的数组:

someArr.remove('elem1')

多一点解释不会在这里错过!
Gaz 2012年

要使用此原型功能,您需要将其粘贴到代码中。然后,您可以将其应用于带有“点符号”的任何数组,例如:someArr.remove('elem1')
yesnik 2013年

3
这样的唯一问题是它会覆盖全局Array对象的remove方法,这意味着项目中依赖于默认行为的任何其他代码最终都会导致错误行为。
jmort253

2
另一个问题是全局变量i被覆盖。
罗兰·伊利格


5

您可以使用.not函数,如下所示:

var arr = [ 1 , 2 , 3 , 5 , 8];
var searchValue = 2;

var newArr = $(arr).not([searchValue]).get();

2
如果值不存在,这将擦除整个数组,因此searchValue = 4将返回一个空白数组。
朱利安K

3
我已将代码复制到jsfiddle中,更改searchValue为4,运行代码,未检测到问题。所有值仍然存在。@ JulianK
RST

4

我的user113716版本。如果找不到匹配项,他将删除一个值,这不好。

var y = [1, 2, 3]
var removeItem = 2;

var i = $.inArray(removeItem,y)

if (i >= 0){
    y.splice(i, 1);
}

alert(y);

现在,如果找到匹配项,则删除1个项目;如果找不到匹配项,则删除0个项目。

怎么运行的:

  • $ .inArray(value,array)是一个jQuery函数,它查找a的第一个索引 value中的array
  • 如果找不到该值,则上面的代码返回-1,因此在执行删除操作之前请检查i是否为有效索引。删除索引-1意味着删除最后一个,这在这里没有帮助。
  • .splice(指数计数)删除count开始值的数量index,所以我们只是想count1

3
//in case somebody needs something like this:  multidimensional array (two items)

var ar = [[0,'a'],[1,'b'],[2,'c'],[3,'d'],[4,'e'],[5,'f']];

var removeItem = 3;  


ar = jQuery.grep(ar, function(n) {
  return n[0] != removeItem;   //or n[1] for second item in two item array
});
ar;

3

有一个简单的接头解决方案。根据W3School,拼接语法如下;

array.splice(index, howmany, item1, ....., itemX)

指数 必填。一个整数,指定要在什么位置添加/删除项目,请使用负值指定从数组末尾开始的位置

多少需要。要删除的项目数。如果设置为0,则不会删除任何项目

item1,...,itemX 可选。要添加到数组中的新项目

请记住,以下js将在给定数组中弹出一个或多个匹配项(如果找到),否则不会删除数组的最后一项。

var x = [1,2,3,4,5,4,4,6,7];
var item = 4;
var startItemIndex = $.inArray(item, x);
var itemsFound = x.filter(function(elem){
                            return elem == item;
                          }).length;

要么

var itemsFound = $.grep(x, function (elem) {
                              return elem == item;
                           }).length;

所以最终看起来应该像下面这样

x.splice( startItemIndex , itemsFound );

希望这可以帮助。


3

首先检查数组中是否存在元素

$.inArray(id, releaseArray) > -1

上面的行返回该元素的索引(如果它存在于数组中),否则返回-1

 releaseArray.splice($.inArray(id, releaseArray), 1);

现在,如果找到的话,上面的行将从数组中删除此元素。总结一下,下面的逻辑是检查并从数组中删除元素所需的代码。

  if ($.inArray(id, releaseArray) > -1) {
                releaseArray.splice($.inArray(id, releaseArray), 1);
            }
            else {
                releaseArray.push(id);
            }

2

我有一个类似的任务,我需要根据数组中对象的属性一次删除多个对象。

因此,经过几次迭代,我最终得到:

list = $.grep(list, function (o) { return !o.IsDeleted });

2

我将使用一个pick_and_remove()函数扩展Array类,如下所示:

var ArrayInstanceExtensions = {
    pick_and_remove: function(index){
        var picked_element = this[index];
        this.splice(index,1);
        return picked_element;
    } 
};
$.extend(Array.prototype, ArrayInstanceExtensions);

尽管看起来有些冗长,但是您现在可以调用pick_and_remove()任何可能需要的数组!

用法:

array = [4,5,6]           //=> [4,5,6]
array.pick_and_remove(1); //=> 5
array;                    //=> [4,6]

您可以在此处以神奇宝贝主题的动作查看所有这些信息。


2
/** SUBTRACT ARRAYS **/

function subtractarrays(array1, array2){
    var difference = [];
    for( var i = 0; i < array1.length; i++ ) {
        if( $.inArray( array1[i], array2 ) == -1 ) {
                difference.push(array1[i]);
        }
    }
return difference;
}  

然后,您可以在代码中的任何位置调用该函数。

var I_like    = ["love", "sex", "food"];
var she_likes = ["love", "food"];

alert( "what I like and she does't like is: " + subtractarrays( I_like, she_likes ) ); //returns "Naughty :P"!

这在所有情况下均有效,并且避免了上述方法中的问题。希望有帮助!


2

试试这个对我有用

_clientsSelected = ["10", "30", "12"];
function (removeItem) {
console.log(removeItem);
   _clientsSelected.splice($.inArray(removeItem, _clientsSelected), 1);
   console.log(_clientsSelected);
`enter code here`},

2

第二个最受支持的答案是在与OP想要的预期行为的单行jQuery方法最接近的轨道上,但是他们在代码末尾迷迷糊糊,并且存在缺陷。如果要删除的项目实际上不在数组中,则最后一个项目将被删除。

少数人注意到了这个问题,有些人提供了循环方法来防范此问题。我提供了我所能找到的最短,最干净的方法,并在他们的回答下评论了根据此方法修复其代码的方法。

var x = [1, 2, "bye", 3, 4];
var y = [1, 2, 3, 4];
var removeItem = "bye";

// Removing an item that exists in array
x.splice( $.inArray(removeItem,x), $.inArray(removeItem,x) ); // This is the one-liner used

// Removing an item that DOESN'T exist in array
y.splice( $.inArray(removeItem,y), $.inArray(removeItem,y) ); // Same usage, different array

// OUTPUT -- both cases are expected to be [1,2,3,4]
alert(x + '\n' + y);

数组x将轻松删除元素“ bye”,而数组y将保持不变。

使用该参数$.inArray(removeItem,array)作为第二个参数实际上最终是要拼接的长度。由于未找到该项目,因此array.splice(-1,-1);其结果为,这将导致不进行任何拼接...都无需为此编写循环。


1

要使用原始JavaScript安全地从数组中删除2:

// Define polyfill for browsers that don't natively support Array.indexOf()
if (!Array.prototype.indexOf) {
  Array.prototype.indexOf = function(searchElement, fromIndex) {
    var k;
    if (this===null) {
      throw new TypeError('"this" is null or not defined');
    }
    var O = Object(this),
      len = O.length >>> 0;
    if (len===0) return -1;
    var n = +fromIndex || 0;
    if (Math.abs(n)===Infinity) n = 0;
    if (n >= len) return -1;
    k = Math.max(n >= 0 ? n : len - Math.abs(n), 0);
    while (k < len) {
      if (k in O && O[k]===searchElement) return k;
      ++k;
    }
    return -1;
  };
}

// Remove first instance of 2 from array
if (y.indexOf(2) > -1) {
  y.splice(y.indexOf(2), 1);
}

/* To remove all instances of 2 from array, change 'if' to 'while':
while (y.indexOf(2) > -1) {
  y.splice(y.indexOf(2), 1);
}
*/

console.log(y);  // Returns [1, 3]

Polyfill来源:Mozilla


0

只是为了补充Sarfraz的答案,令人惊讶的是没有人将它变成一个函数。

如果您在数组中多次拥有相同的值,请使用.filter方法使用ddagsan的答案。

function arrayRemoveVal(array, removeValue){
	var newArray = jQuery.grep(array, function(value) {return value != removeValue;});
	return newArray;
}
var promoItems = [1,2,3,4];	
promoItems = arrayRemoveVal(promoItems, 3);// removes 3
console.log(promoItems);
promoItems = arrayRemoveVal(promoItems, 3);// removes nothing
console.log(promoItems);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.