Search the Community
Showing results for tags 'localstorage'.
Found 9 results
-
Hello, I am trying to make website with inclusive design for my homework and I have three functions that are changing the text size, text style and site color theme, but I can not save the changes after I reload the page. This is my code for changing the text size: localStorage.setItem('z', '1'); function size() { if (localStorage.getItem('z')=="1"){ txt = document.getElementById("a").style.fontSize = "25px"; localStorage.removeItem("z"); localStorage.setItem('z', '2'); } else if (localStorage.getItem('z')=="2") { txt = document.getElementById("a").style.fontSize = "30px"; localStorage.removeItem("z"); localStorage.setItem('z', '3'); } else { txt = document.getElementById("a").style.fontSize = "20px"; localStorage.removeItem("z"); localStorage.setItem('z', '1'); } } The code in my html is this: <body onload="size()"> <button type="button" " onclick="size();">Change Text Size</button> <div id='a'>Some text</div> </body> I believe I can make the other two function save their changes If I see how to make this one. Thank you !
-
Hello, I'm trying to make a to-do list that saves the entries on the server/in the cloud so the same added items can be viewed on different devices. I researched a bit on LocalStorage but I realized it's just local, obviously. So how do I make it so my site stores the added items on the server?
-
BACKGROUND: I am baffled by the failure of this code to display "Return User" when the browser page is refreshed or the browser page is closed and then reopened. The vslue of the console.log(localStorage) displays: Storage { return_user: "true", length: 1 } CODE: const output = document.querySelector('.output'); if (typeof localStorage !== "undefined") { var localStorage = window.localStorage; if(localStorage.getItem("return_user")) { output.innerHTML = "Return User"; } else { output.innerHTML = "New User"; localStorage.setItem("return_user", true); console.log(localStorage); } } else { output.innerHTML = "Sorry, local storage is not supported."; } QUESTION: Any ideas? Roddy
-
BACKGROUND: Having recently learned about localStorage and familiarized myself with its methods I would now like to apply it as suggested by one of W3Schools' mentors for the purpose of identifying return visitors. Searching on the internet turned up little that was very satisfying. QUESTION: Is there a standard routine for identifying return visitors or must I develop my own? Roddy
-
I hope there is a simple solution to this. I want to use localStorage to remember a user, but if it's not there I want to open a form so the user can enter the info in the input box and press Submit. Then I would put that info into the localStorage for next time. I can get the form to open and display fine, but the code just continues to execute after I open the form ( display set to "block"). How can I get the code to stop and wait for the input to come in before continuing with the next line of code? I have looked at the <dialog> tag with '.showmodal' which would work I guess, but it says it is not supported in Internet Explorer or FireFox; I want it to work in all browsers. I have tried a while loop to wait until the 'submit' button is pushed, but the whole thing bombs out when I put it in and the modal form doesn't even show. If I assign a value to the input , and insert the line "userID = document.getElementById("enterUserID").value;" just b/4 the return statement, I get the value I assigned. I appreciate any help explaining it to me.... I have included my code if it helps. <!DOCTYPE html> <html> <head> <title>Schenectady Kettles</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- <link --> <style> #logInModal {display:none;z-index:3;width:80%;height:200px;margin:auto; color:purple;background-color:lemonchiffon;text-align:center; font-size:8vw;font-weight:bold;} </style> </head> <body> <h3>Testing for Log In</h3> <div> <button id="logInBtn" type="button" onclick="logInClicked()">Log In</button><br> </div> <!-- Log In Modal --> <div id="logInModal"> <div> Enter User ID<br> <input type="text" id="enterUserID" placeholder="User ID" autofocus> <!-- Check input !! --> <button type="button" id="getIDBtn">Submit</button> </div> </div> <p id="demo"></p> <script> function logInClicked() { var uID = "hello"; if (typeof(Storage) !== "undefined") { if (localStorage.userID) { uID = localStorage.userID; } else { uID = getUserID(); document.getElementById("demo").innerHTML = uID; } } } function getUserID() { var userID = "123"; document.getElementById("logInModal").style.display = "block"; document.getElementById("getIDBtn").onclick = function() {userID = document.getElementById("enterUserID").value;}; return userID; } </script> </body> </html>
-
In the following script, I need to store values of desSet from repeated form submits, but they're getting over-written on every form submit, because localStorage section is nested in onclick section. Problem is I don't know how to access desSet values without being in the onclick function (because the click needs to happen to generate the value). How to keep every desSet value from form submits in localStorage? Also, the "description" element that desSet is in gets cleared on page refresh. How to keep that on the page? Thanks in advance for help. document.getElementById('btn').onclick = function() { ..................etc.............. function localS(){ var valDes = document.getElementById('idDes').value; localStorage.setItem("desSet", valDes); var desP = document.createElement("p"); var desNode = document.createTextNode(valDes); desP.appendChild(desNode); desP.value = localStorage.getItem("desSet"); document.getElementById("description").appendChild(desP); } localS(); }; // close onclick function
-
Hi All,I'm a bit confused as to how it all works - - sometimes I set the local localStorage like:localStorage.setItem("First", "Bob");localStorage.setItem("Last", "Smith");then read on another page like:<span id="First"></span> <span id="Last"></span><script>document.getElementById('First').innerHTML = localStorage.getItem("First");document.getElementById('Last').innerHTML = localStorage.getItem("Last");</script>sometimes it shows fine and sometimes on other pages some fields are blankand other page may show error like:Uncaught TypeError: Cannot set property 'innerHTML' of nullQ: What am I doing wrong - why was there sometimes errors?- if I use = document.getElementById('Last') - but fail to have the correct span id="xxxx" - does that cause the errors?- What is the criteria for getting this to always have fields show up?
-
Hello, MyProject I am having a hard time making the form inputs align with the localstorage table. The forms will have to fit in between the ID and ACTIONS columns and align with where the data is being inputted. I also am having a hard time setting the widths for the table columns. Adjusting the padding is not a problem, but setting a set width is a problem. Any help would be greatly appreciated. Also, is there any way to change the local storage ID something like GW-"DATE"-"TIME" rather than numerically going up 1-2-3-4-5-etc.? Thank you, I SIDEARM I
-
I have a message bar that I made, but am not the best with scripting, so not sure how to handle the local storage Here is what I have so far http://jsfiddle.net/nDtWM/16/ I believe I have it rigged so it is persistent until the user clears the cache, but am not sure. Also, it does not work so I cannot know Any advice is appreciated.
