[Lefseq]

Здравствуйте. Помогите, пожалуйста решить следующую задачу. Ниже скрипт, который запоминает данные из формы введенные посетителем.

Проблема в том, что если на сайте несколько таких запоминалок, на разных страницах. То Браузер запоминает только данные введенные на последней странице.

Подскажите, как сделать, чтобы можно было ввести данные на странице А, затем на странице В, И уже на странице С получить выдачу с обеих страниц А и В?


Скрипт на странице запоминалки:

(function main() {
        var form = document.querySelector("#user-greeting > form");
        
        form.addEventListener("submit", function(event) {
            event.preventDefault();
            var data = new FormData(form);
            localStorage.name = JSON.stringify(Object.fromEntries(data));
            form.submit();
        });
    })();

Скрипт на странице выдачи:

document.addEventListener("DOMContentLoaded", function() {
    if("name" in localStorage === false) return location.replace("./");
    const data = JSON.parse(localStorage.name || "{}");
    
    for(const [key, value] of Object.entries(data)) {
      for(const node of document.querySelectorAll(`[data-field="${key}"]`)) {
        node.textContent = value;
      }
    }
    });

Форма:

<section id="user-greeting">
<form action="">    
 
<input il-action="listen" autocomplete="firstname" name="firstname" type="text">
 
<input il-action="listen" autocomplete="lastname" name="lastname" type="text">
 
<button>Отправить</button>
 
</form>
</section>

На странице выдачи:

<span data-field="firstname"><span></span></span>
<span data-field="lastname"><span></span></span>