function addMsg() { let doc = document, msgName, msgDesc, msgDate, html; if (doc.getElementById('name').value) { msgName = doc.getElementById('name').value; } else { doc.getElementById('name').focus(); return; } if (doc.getElementById('desc').value) { msgDesc = doc.getElementById('desc').value } else { doc.getElementById('desc').focus(); return; } msgDate = doc.getElementById('date').value = new Date(); html = '<section class="msg"><div><span>By ' + msgName + '</span><span>' + msgDate + '</span></div> <p>' + msgDesc + '</p></section>'; let test = { name: msgName, desc: msgDesc, date: msgDate } localStorage.setItem('test', JSON.stringify(test)); //if (doc.getElementById('result').innerHTML += html) doc.forms.myform.reset(); let testMSG = JSON.parse(localStorage.getItem("test")); if (doc.getElementById('testMSG').innerHTML += html) doc.forms.myform.reset(); } 
 input, textarea { width: 100%; box-sizing: border-box; } section { background: #e9e9e9; border: 1px solid #ccc; width: 320px; margin: 3px; } p { border: 1px solid #666; margin: 3px; padding: 5px; font-size: 14px; } span { font-size: 12px; margin: 5px; } 
 <aside class="right" id="testMSG"> </aside> <!-- form msg comm --> <section class="form-box"> <form id="myform" action=""> <input id="name" value="" placeholder="Type your nickname here..." name="login" > <textarea id="desc" placeholder="Write your comment here..." name="msg"></textarea> <input id="date" type="hidden" /> <input value="OK" type="button" onclick="addMsg()" /> </form> </section>

Good day! I tried to master the possibilities of localStorage for myself, the record goes perfectly well. But after reloading the page, the data is not saved. Tell me what's wrong.

Thank you in advance!

  • In Chrome and FF, it seems, everything works. Where is the test? What error gives? - Dmytryk
  • write to localStorage without errors. How can I display information from localStorage? - ntym
  • Screen prntscr.com/i0lzhg - ntym
  • Your question is that you cannot organize data output from LocalStorage. However, in fact, the data is displayed, and the problem is that you cannot add data to the markup, while maintaining the previous ones. Change the question. - Dmytryk
  • one
    Well, initially, they are not in the markup. They must somehow get there. Who will output them? To do this: firstly, the data in LocalStorage is not replaced, but added; secondly, when the page loads, you need to contact LocalStorage, get the data and display it on the page; thirdly, just in case, Localctorage can be operated as with a regular object in which data is stored as a string, for example, var test = JSON.parse(Localstorage.test) . Because You try to master LocalStorage - I will not write code. Try, for a start, for yourself - Dmytryk

0