js: Показать текст, сохраненный в localStorage, на той же странице - PullRequest
Новая
       8

js: Показать текст, сохраненный в localStorage, на той же странице

0 голосов
/ 12 июля 2020

Я новичок в javascript и трачу слишком много времени на то, чтобы заставить это работать. Что я хочу сделать:

1. html генерирует предложения из разных массивов. Таким образом, пользователь может нажать sh кнопку «сгенерировать», и массивы будут объединяться случайным образом, пока есть предложение, которое ему / ей нравится. Мне нужно это сгенерированное предложение на 2. html. Я использовал localStorage для хранения сгенерированного предложения. Я хочу, чтобы сгенерированное предложение на 1. html также отображалось на 1. html после того, как Пользователь нажимает кнопку «генерировать». Так и не удалось заставить его работать должным образом.

Я пока заменил слова предложений буквами.

Здесь код 1. html

let green, display, button, clock, end;
    green = ["a", "d", "d", "v"];
    display = ["f", "g", "v", "h"];
    button = ["h", "r", "h", "h"];
    clock = ["h", "t", "c", "r"];
    end = ["g", "t", "x", "r"];
    
    
    
    function sentence() {
      let rand1 = Math.floor(Math.random() * 4);
        
      let content = clock[rand1] + " " + display[rand1] + " " + button[rand1] + " " + green[rand1] + " " + end[rand1];
    
      return content;
    }
    
    // Check browser support
    if (typeof(Storage) !== "undefined") {
        localStorage.setItem("sentence", sentence());
    }
<h1>Generator</h1>
    <button onclick="sentence()">generate</button>

Это 2. html

<div id="result"></div>
     
    <script>
        // Check browser support
        if (typeof(Storage) !== "undefined") {
            document.getElementById("result").innerHTML = localStorage.getItem("sentence");
        } else {
            document.getElementById("result").innerHTML = "Browser does not support Web Storage.";
        }
    </script>

1 Ответ

0 голосов
/ 12 июля 2020

Функция sentence() сама по себе не сохраняет в localStorage. При каждом вызове он генерирует только новое предложение. Вы можете изменить следующим образом: 

function sentence() {
  let rand1 = Math.floor(Math.random() * 4);
    
  let content = clock[rand1] + " " + display[rand1] + " " + button[rand1] + " " + green[rand1] + " " + end[rand1];

    // Check browser support
    if (typeof(Storage) !== "undefined") {
        localStorage.setItem("sentence", content);
    }

    const message = document.querySelector('.message');
    message.innerText = content;
}

И в 1. html добавьте это: 

<div class="message"></div>
...