如何在JQuery中添加和删除数组而无需重新索引数组键

时间:2018-11-14 09:02:05

标签: javascript jquery html arrays

当单击除主数组中的新数组追加(推)之外的任何复选框时,我都有该复选框的列表。如果取消选中,则删除但不更改当前数组的任何索引。

解释:-

就像:-当我单击第一个复选框而不是像这样的数组

0: ["2"]

就像:-当我单击第二个复选框而不是像这样的数组

0: ["2"]
1: ["3"]

就像:-当我单击四个复选框而不是像数组一样

0: ["2"]
1: ["3"]
2: ["5"]

如果先取消选中我需要的数组,则取消选中复选框之后

1: ["3"]
2: ["5"]

再次单击第一个复选框,而不是需要数组链接

1: ["3"]
2: ["5"]
3: ["2"]

不需要更改任何数组索引键

https://jsfiddle.net/tx63yjhg/

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" value="1" />
<input type="checkbox" value="2" />
<input type="checkbox" value="3" />
<input type="checkbox" value="4" />
<input type="checkbox" value="5" />
<input type="checkbox" value="6" />
<input type="checkbox" value="7" />

<script type="text/javascript">
var values = [];
var new_value = [];

$("input").on("change", function() 
{
  var $this = $(this);
  
  if ($this.is(":checked")) 
  {
  	var new_data = [$this.val()];
  	new_value.push(new_data);
  }
  else 
  {	
  	//remove array when uncheck checkbox
  }
  console.log('new_value',new_value);
});
</script>

如何删除阵列并再次添加??

2 个答案:

答案 0 :(得分:1)

我不确定您是否使用数组数组达到相同的效果。相反,您可以尝试使用如下对象。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" value="1" />
<input type="checkbox" value="2" />
<input type="checkbox" value="3" />
<input type="checkbox" value="4" />
<input type="checkbox" value="5" />
<input type="checkbox" value="6" />
<input type="checkbox" value="7" />

<script type="text/javascript">
var values = [];
var new_value = {};
var counter = 0;

$("input").on("change", function() {
  var $this = $(this);
  
  if ($this.is(":checked")) {
    new_value[counter++] = [$this.val()];
  } else {	
    Object.entries(new_value).forEach(([k,v]) => {
      if(v.includes($this.val())) delete new_value[k];
    });
  }
  console.log('new_value',new_value);
});
</script>

编辑

要添加

new_value[counter++] = {id1: 100, id2: 200, "id3": 300,"value":474}; // e.g. object

要删除

let valueToBeRemoved = 234; // e.g. value to be removed

Object.entries(new_value).forEach(([k,v]) => {
  if(v.value === valueToBeRemoved) delete new_value[k];
})

编辑2

for (var k in new_value) {
    if(new_value[k].value === valueToBeRemoved) delete new_value[k];
}

答案 1 :(得分:-1)

简单:

var values = [];

$("input").on("change", function() 
{
  var $this = $(this);
  var new_value = [];
  
  if ($this.is(":checked")) 
  {
  	var new_data = [$this.val()];
  	new_value.push(new_data);
  }
  console.log('new_value',new_value);
});