在数组内切片节点

时间:2019-03-08 02:49:17

标签: javascript html arrays list slice

当我第一次从第二个选择菜单中选择两个选项时,该阵列将被这两个选择填充。我想要的是第二个选择的选项替换第一个选择的选项,因此即使我确实从第二个选择菜单中选择了两个选项,阵列的长度也将保持不变,并在这些选择之间动态变化。我希望你明白。谢谢你的帮助。我知道我可以使它成为一个函数,但这个问题将不存在,但就我的使用而言,我无法做到这一点。

var select1 = document.getElementById('select1');
var select2 = document.getElementById('select2');
var array = []
        
function myFunct1() { 
  var one = select1.options[select1.selectedIndex].value;
  array.splice(0, 1, one);
  console.log(array);
        }
        
function myFunct2() {
  var two = select2.options[select2.selectedIndex].value;
  array.splice(1, 1, two);
  console.log(array);
        }
<select id = 'select1' onchange = 'myFunct1()'>
        <option disabled selected value> -- select an option -- </option>
        <option value = 'Dog'>ONE</option>
        <option value = 'Cat'>TWO</option>
        <option value = 'Bear'>THREE</option>
        </select>
    
        
    <select id = 'select2' onchange = 'myFunct2()'>
        <option disabled selected value> -- select an option -- </option>
        <option value = 'Dog'>ONE</option>
        <option value = 'Cat'>TWO</option>
        <option value = 'Bear'>THREE</option>
        </select>

2 个答案:

答案 0 :(得分:1)

首先使用Array.prototype.unshift()来增加价值。您可以检查数组中是否存在元素 使用includes()
代替创建两个函数,您可以创建相同的函数并将不同的参数传递给它。

var array = [];
        
        function myFunct(val){ 
            if(!array.includes(val)) array.unshift(val);
            console.log(array);
        }
<button onclick = 'myFunct("One")'>ONE</button>
        <button onclick = 'myFunct("Two")'>TWO</button>

如果要用第一个值替换新值,请使用此代码

function myFunct(val) {
     array.unshift(val);
     array = [... new Set(array)];
     console.log(array); 
}

更新:

var select1 = document.getElementById('select1');
var select2 = document.getElementById('select2');
var array = [];
let sel1 = false;

function myFunct1() { 
  var one = select1.options[select1.selectedIndex].value;
  if(array.length === 1 && !sel1) array.unshift(one);
  else array.splice(0,1,one);
  console.log(array);
  sel1 = true;
}

function myFunct2() {
  var two = select2.options[select2.selectedIndex].value;
  array.splice(sel1, 1, two);
  console.log(array);
}

答案 1 :(得分:1)

尝试一下:

var array = [];
        
function myFunct() {
  if(array.indexOf('One') === -1 ) { array.unshift('One') ; }    
  console.log(array);
}
        
function myFunct2() {
  if(array.indexOf('Two') === -1 ) { array.push('Two') ; }
  console.log(array);
}
<button onclick = 'myFunct()'>ONE</button>
<button onclick = 'myFunct2()'>TWO</button>