увеличить имя объекта localStorage для хранения данных из входных данных - PullRequest
Новая
       14

увеличить имя объекта localStorage для хранения данных из входных данных

0 голосов
/ 08 января 2020

Это только для целей тестирования.

Я пытаюсь сохранить данные с 3 входов (типы: текст, число) и сохранить их в localStorage. которые непрерывно увеличивают каждую отправку.

Я, кажется, перезаписываю значение 0, значение 1, значение 2 во втором представлении вместо дальнейшего увеличения до значения 3, значение 4, значение 5.

ожидаемый результат:

  1. первое отправленное значение0, значение1, значение2
  2. второе отправленное значение3, значение4, значение5
  3. третье отправленное значение6, значение7, значение8 et c.

JS: 

document.getElementById('btn').addEventListener('click', createEntry());

function createEntry(){
    const inputs = document.getElementsByTagName("input");

    let i;
    for (i = 0; i < inputs.length; i++) {
        let value = inputs[i].value; 

        localStorage.setItem(`value${i}`, JSON.stringify(value));

    }  
};

собрать весь ввод путем захвата всех входных тегов, l oop через найденные элементы. назначить новый оператор зацикленным значениям и сохранить их в localStorage. увеличивайте имя элемента, чтобы избежать перезаписи ранее зацикленного элемента.

HTML: 

<div class="form">
      <input type="text" required>
      <input type="text" required>
      <input type="number" min="1" max="120" required>
      <button type="button" id="btn">Add</button>
</div>

1 Ответ

0 голосов
/ 08 января 2020

То, как вы его закодировали, отменит сохраненные значения, потому что i всегда сбрасывается в 0 при запуске функции. Есть много разных способов переписать ваш код, один из которых приведен ниже:

Сохранение последнего использованного индекса 

// By the way, there was an error in this line, you were calling createEntry()
// instead of passing the function as a callback.
document.getElementById('btn').addEventListener('click', createEntry);

function createEntry() {
    const inputs = document.getElementsByTagName("input");

    let i;
    let index = getNextIndex();

    for (i = 0; i < inputs.length; i++) {
        let value = inputs[i].value; 
        localStorage.setItem(`value${index}`, JSON.stringify(value));
        index++;
    }

    localStorage.setItem('nextIndex', index);
}

function getNextIndex() {
    const index = localStorage.getItem('nextIndex');
    return index ? parseInt(index) : 0;
}
...