Databases
StackOverflow2013
Postsdbo
PO
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>Im pretty sure when using setItem, you need to set items using a (key, value) pair.</p> <p>See this page as reference: <a href="http://en.wikipedia.org/wiki/Web_storage#localStorage" rel="nofollow">http://en.wikipedia.org/wiki/Web_storage#localStorage</a></p> <p>Try this:</p> <pre><code>&lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="utf-8" /&gt; &lt;title&gt;Storing Data&lt;/title&gt; &lt;meta name="description" content="" /&gt; &lt;meta name="author" content="Alan Sylvestre" /&gt; &lt;style&gt; h1 { background-color: #000000; color: #C00000; padding: 10 px; padding: 10 px; text-align: center; } &lt;/style&gt; &lt;/head&gt; &lt;body align="center" style="background-color:red;"&gt; &lt;div&gt; &lt;header&gt; &lt;h1&gt;Local Storage&lt;/h1&gt; &lt;/header&gt; &lt;input type="text" id="storage1" size="40" placeholder="Please enter a value"&gt; &lt;input type="text" id="storage2" size="40" placeholder="Please enter a value"&gt; &lt;input type="text" id="storage3" size="40" placeholder="Please enter a value"&gt; &lt;input type="text" id="storage4" size="40" placeholder="Please enter a value"&gt; &lt;br&gt; &lt;br&gt; &lt;input type="button" id="addValue" value="Store Input Values" onclick='storageValue();'&gt; &lt;div id="storageDiv"&gt;&lt;/div&gt; &lt;nav&gt; &lt;p&gt; &lt;a href="/"&gt;Home&lt;/a&gt; &lt;/p&gt; &lt;p&gt; &lt;a href="/contact"&gt;Contact&lt;/a&gt; &lt;/p&gt; &lt;/nav&gt; &lt;div&gt; &lt;/div&gt; &lt;footer&gt; &lt;p&gt; &amp;copy; Copyright by Alan Sylvestre &lt;/p&gt; &lt;/footer&gt; &lt;/div&gt; &lt;/body&gt; &lt;/html&gt; &lt;script&gt; function storageValue() { var uno = document.getElementById("storage1"); var duck = uno.value var dos = document.getElementById("storage2"); var duckie = dos.value var tres = document.getElementById("storage3"); var rubberDuck = tres.value var quatro = document.getElementById("storage4"); var rubberDuckie = quatro.value alert("Your stored values are: " + duck + "," + duckie + "," + rubberDuck + "," + rubberDuckie); localStorage.setItem('duck', duck); localStorage.setItem('duckie', duckie); localStorage.setItem('rubberDuck', rubberDuck); localStorage.setItem('rubberDuckie', rubberDuckie); checkLocalStorage(); } function checkLocalStorage() { var div = document.getElementById("storageDiv"); div.innerHTML = localStorage["duck"] + localStorage["duckie"] + localStorage["rubberDuck"] + localStorage["rubberDuckie"]; } checkLocalStorage(); &lt;/script&gt; </code></pre> <p>Also, I put the script below the html so it is ran after the html. I also added an immediate call to checkLocalStorage (last line of script).</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload