Я пытаюсь вставить свою переменную данных в локальное хранилище. Почему это не определено? - PullRequest
0 голосов
/ 07 января 2019

Я довольно новичок в использовании localStorage, так что извините за мое невежество и потенциальное повторение этого вопроса. Я пока не могу получить ответ.

У меня есть форма с большим количеством тегов ввода. Я храню их значения в переменной var data var data = document.querySelectorAll( "input" ).value;

когда я делаю window.localStorage.setItem('data', JSON.stringify(data.value)) , он сохраняет данные в хранилище со значением undefined. Я понял, что мои var-данные на самом деле не улавливают все пользовательские вводимые значения, но я не мог понять, как это сделать.

Мое намерение состоит в том, чтобы сделать данные var объектом, который хранит другие объекты со значениями полей ввода. затем отправьте эти данные в localStorage. С ЧИСТЫМ JS

Ответы [ 2 ]

0 голосов
/ 07 января 2019

Попробуйте этот код, он пишет в localStorage и читает из него в консоль (инструмент вставки кода stackoverflow не позволяет работать с localStorage, поэтому код находится в другой изолированной программной среде JS): https://plnkr.co/edit/0e1R1aDTneQ1RA0Dvasj?p=preview

код:

<!DOCTYPE html>
<html>
<body>
  <form action="/action_page.php">
  First name:<br>
  <input type="text" name="firstname" value="Mickey">
  <br>
  Last name:<br>
  <input type="text" name="lastname" value="Mouse">
  <br><br>
  <input type="submit" value="Submit">
  </form> 
  
  <script>
    let data = document.querySelectorAll("input");
    let formData=[];
    
    console.log('data', data);
    
    for(let i=0; i<data.length; i++){
      formData.push({ name: data[i].name, value: data[i].value })
    }
    
    console.log("formData for localStorage", formData)
    
    localStorage.setItem('formData', JSON.stringify(formData));
    let output = localStorage.getItem('formData');
    
    console.log('output', JSON.parse(output));

  </script>
</body>
</html>
0 голосов
/ 07 января 2019

Как отмечается в комментариях, вам нужно перебрать свои входные данные, чтобы получить значения, а затем сохранить их в localStorage. Например:

const inputs = document.querySelectorAll('input');

let data = [];
for (let input of inputs) {
  data.push(input.value);
}

window.localStorage.setItem('data', data);

Кроме того, если вы действительно пытаетесь сохранить данные в формате JSON (возможно, почему вы пытаетесь использовать JSON.stringify()), то вы можете сделать что-то вроде следующего (хотя было бы лучше, если бы ваши элементы input имели уникальные значения идентификатора или имени, которые вы можете использовать в качестве ключей, а не просто индекс выбранного ввода, как в примере ниже).

const inputs = document.querySelectorAll('input');

let data = {};
inputs.forEach((input, i) => {
  data[i] = input.value;
});

window.localStorage.setItem('data', JSON.stringify(data));
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...