Как собрать sh элементов и сохранить их в массиве в чистом виде Javascript? - PullRequest
1 голос
/ 07 февраля 2020

Запутано с основами.

Когда я нажимаю клавишу ввода или нажимаю кнопку, элемент массива list изменяется, а не добавляется новый элемент, который я написал.

Также, Я хотел бы набрать reset для <input type='text' maxlength='8' id='aName' placeholder='Write a name.' onKeyDown='enterkey();' />, но понятия не имею.

Как я могу изменить приведенный ниже код?

function enterkey() {
  if (window.event.keyCode == 13) {
    pushingName();
  }
}

function pushingName(){
  var list=[];
  var oneName = document.getElementById('aName').value;
  var stringName = oneName.toString();

  var nameList = list.push(stringName);

  console.log(list);
}
<input type='text' maxlength='8' id='aName' placeholder='Write a name.' onKeyDown='enterkey();' />
<button onclick='pushingName();'>ADD</button>

1 Ответ

1 голос
/ 07 февраля 2020

Вы можете попробовать этот обновленный фрагмент ниже.

Кроме того, если вам это нужно, он также:

  1. вырезает пробелы в начале и конце, поэтому ' ss ' => 'ss'

  2. ничего не делает, когда строка пуста

  3. избегая дублирования в массиве

  4. сбрасывает входное значение после его добавления. (не сбрасывается в случае попытки создания ddd дубликата)

  5. удаляется с помощью другой кнопки

let list = [];


function enterkey() {
  if (window.event.keyCode == 13) {
    pushingName();
  }
}

function pushingName(){

  var elName = document.getElementById('aName');
  var stringName = elName.value.toString();
  
  // trimming string if you need it
  stringName = stringName.trim();
  
  if (!stringName.length) {
    return; // check ot mpty string if you need it
  }

  if (list.indexOf(stringName) === -1) { // avoid duplications if you need it
    var nameList = list.push(stringName);
    
    elName.value = ''; // reset value to empty if was added
  }
  
  console.log(list);
}

function removeName(){

  var oneName = document.getElementById('aName').value;
  var stringName = oneName.toString();
  
  // trimming string if you need it
  stringName = stringName.trim();
  
  if (!stringName.length) {
    return; // check ot mpty string if you need it
  }

  // filtering our stringName
  list = list.filter(item => item !== stringName);

  
  console.log(list);
}
<input type='text' maxlength='8' id='aName' placeholder='Write a name.' onKeyDown='enterkey();' />
<button onclick='pushingName();'>ADD</button>
<button onclick='removeName();'>REMOVE</button>
...