javascript-从数组中删除特定元素会导致问题

我有一个数组,如果我删除一个特定的元素,它将删除它,但是稍后,如果我再次删除另一个元素,新选择的元素将被删除,但是先前删除的元素将出现,如图5所示.

请首先参考上面的图片,首先我从阵列中删除了手机,然后又删除了“帐户已禁用”,但在第二张表中,以前删除的元素手机仍然存在

var selectedOpts = $('#lstBox1 option:selected');

var text = selectedOpts.val();

var colData = [];

this.firmData.forEach(function (dta) {
    colData.push(dta.DisplayName);
})

const removeItem = value => colData.filter(item => item !== value)
    console.table(removeItem(text))
    console.log(text);

更新

实际需求

我的要求是我需要同时移动数据,反之亦然,我也想将其从数组中删除,因为我现在只能附加这些值,但无法从数组中删除它.

1st column html

<div class="menu">
    <select multiple="multiple" id='lstBox1' >
    </select>
</div>

1st column JS code

 self.firmData.forEach(function (data) {                  
   $("#lstBox1").append($('<option class="items">').text(data.DisplayName).attr('value',data.DisplayName));                        
  });

2nd column HTMl

<div class="menu">
    <select multiple="multiple" id='lstBox2' >
    </select>
</div>

2nd column JS code

self.data.forEach(function (data) {
 $("#lstBox2").append($('<option class="items">').text(data.columnsexpo).attr('value',data.columnsexpo));
 });

Button functions

 "click #btnRight": function(e){
      var selectedOpts = $('#lstBox1 option:selected');
      var text = selectedOpts.val();

      $('#lstBox2').append($(selectedOpts).clone())
      this.data.push(columnsexpo: text);
   }

  "click #btnLeft": function(e){
      var selectedOpts = $('#lstBox2 option:selected');
      var text = selectedOpts.val();

      $('#lstBox1').append($(selectedOpts).clone())
      this.data.push(columnsexpo: text);
   }

最佳答案

从问题中不确定您要做什么,但这应该从原始数组中删除所需的项.警告-可能包含错误/错误,但是Array.prototype.splice会从数组中删除项目.

var selectedOpts = $('#lstBox1 option:selected');

var text = selectedOpts.val();

var colData = [];

this.firmData.forEach(function (dta) {
    colData.push(dta.DisplayName);
})

function findItem(item) {
  return item == text;
}

colData.splice(colData.findIndex(findItem),1);
console.table(colData)
console.log(text);