2017-11-13 4 views
1

Ich versuche, auf lokalen Speicher zu speichern, wenn ich die gleichen Fenster geöffnet habe und gehen Sie auf andere Websites und kommen Sie zurück, sollte es mir gespeicherte Elemente zeigen, aber wenn ich Browser schließe und wieder kommen dann es shoudnt, und ich benutze Notepad ++ , < Abschnitt> Tag funktioniert nicht, andere Texte haben eine Farbe auf ihnen, aber dieser ist komplett schwarz. Ich habe auch localStorage.setItem und localStorage.getItem versucht. Speichern im lokalen Speicher (html5) funktioniert nicht?

function doFirst() { 
 
    var button = document.getElementById("button"); 
 
    window.addEventListener("click", saveCrap, false); 
 
    display(); 
 

 
} 
 
function saveCrap() { 
 
    var one =document.getElementById("one").value; 
 
    var two =document.getElementById("two").value; 
 
    sessionStorage.setItem(one, two); 
 
    display(); 
 
    document.getElementById("one").value = ""; 
 
    document.getElementById("two").value = ""; 
 
} 
 
function display() { 
 
    var rightbox = document.getElementById("rightbox"); 
 
    rightbox.innerHTML = ""; 
 

 
    for (var x=0;x<sessionStorage.length;x++) { 
 
     var a= sessionStorage.key(x); 
 
     var b= sessionStorage.getItem(a); 
 
     rightbox.innerHTML += a+" - "+b+"<br/>"; 
 
    } 
 
} 
 
window.addEventListener("load", doFirst, false);
#leftbox { 
 
    float:left; 
 
    padding:20px; 
 
    border:3px solid red; 
 
} 
 
#rightbox { 
 
    float:left; 
 
    width:250px; 
 
    margin-left:20px; 
 
    padding:20px; 
 
    border:3px solid blue; 
 
}
<!DOCTYPE html> 
 
<html lang="en"> 
 
    <head> 
 
     <title>Log In</title> 
 
     <meta charset="utf-8"> 
 
     <!-- < meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1"> --> 
 
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/7.0.0/normalize.css" /> 
 

 
     <meta name="viewport" content="width=device-width, initial-scale=1"> 
 

 
     <link rel="stylesheet" href="boston.css"> 
 
     <script src="boston.js"></script> 
 

 
     <style> 
 
      * { 
 
       box-sizing: border-box; 
 
       -webkit-box-sizing 
 
       -moz-box-sizing: border-box; 
 
      } 
 
      body { 
 
       margin:50px 0; 
 
       padding:0px; 
 
       text-align:center; 
 
      } 
 
     </style> 
 

 
    </head> 
 
    <body> 
 

 
     <section id="leftbox"> 
 
    
 
      <form> 
 
       <p>(key) One: <input type="text" id="one"></p> 
 
       <p>(value) Two <textarea id="two"></textarea></p> 
 
       <p><input type="button" id="button" value="Save"></p> 
 
      </form> 
 
     </section> 
 
    
 
     <section id="rightbox"> 
 
      Nothing yet hoss! 
 
     </section> 
 
    
 
    </body> 
 
</html>

+4

Nirgendwo in Ihrem Code speichern Sie auf localStorage. Nur SessionStorage? Es würde Sinn machen, dass die Daten nicht bestehen bleiben, weil die Sitzung gelöscht wurde. – filoxo

+0

Ich mache Login-Informationen, wenn Benutzer einen schreiben: sags und zwei: shgr, dann diese Informationen ich will es in den Speicher, lokalen Speicher gehen? wann immer ich will, könnte ich gehen und überprüfen, ob es neue Benutzer gibt, könnten Sie dabei helfen? –

+0

... stellen Sie sicher, dass Sie lokalen Speicher nicht lokal testen. Einige (? Oder alle) Browser werden das lokale Speicherobjekt in lokalen Anwendungen nicht anzeigen. –

Antwort

2

HTML Web Storage Objects. HTML-Webspeicher bietet zwei Objekte für , die Daten auf dem Client speichern: window.localStorage - speichert Daten ohne Ablaufdatum . window.sessionStorage - speichert Daten für eine Sitzung (Daten verloren gehen, wenn der Browser-Tab geschlossen wird)

Wenn Sie Daten bestehen wollen über mehrere Sitzungen dann Localstorage verwenden wie

//Set data 
localStorage.setItem('key','value'); 

//Get data 
var data = localStorage.getItem('key'); 

Dies ist, was Sie sollte tun

function doFirst() 
    { 
     var button = document.getElementById("button"); 
     window.addEventListener("click", saveCrap, false); 
     display(); 

    } 
    function saveCrap() 
    { 
     var one = document.getElementById("one").value; 
     var two = document.getElementById("two").value; 
     localStorage.setItem(one, two); 
     display(); 
     document.getElementById("one").value = ""; 
     document.getElementById("two").value = ""; 
    } 
    function display() 
    { 
     var rightbox = document.getElementById("rightbox"); 
     rightbox.innerHTML = ""; 

     for (var x = 0; x < localStorage.length; x++) 
     { 
      var a = localStorage.key(x); 
      var b = localStorage.getItem(a); 
      rightbox.innerHTML += a + " - " + b + "<br/>"; 
     } 
    } 
    window.addEventListener("load", doFirst, false); 
+0

Ja, ich habe den Code so geändert, aber wenn ich den Browser schließe, werden die Daten verloren gehen, warum? –

+0

Persistenz ist nicht konsistent implementiert. Insbesondere kann localStorage durch Benutzeraktionen gelöscht werden und kann versehentlich gelöscht werden (wer würde denken, dass das Löschen aller Cookies auch localStorage löscht?). – Hey24sheep

+1

Wenn Sie "Browserverlauf beim Beenden löschen" nicht löschen, wird LS nicht gelöscht – Hey24sheep

Verwandte Themen