2016-07-27 11 views
0

Ich mache derzeit ein Schulprojekt und ich muss eine serverseitige Anwendung stimulieren. Was ich ersetze ist "Local Storage", aber ich habe ein Problem. Ich bin in der Lage, den Text in meinem "Textfeld" übereinander zu stapeln, sobald der Benutzer seine Frage gestellt hat. Sobald sie neu geladen werden, werden die Daten weiterhin angezeigt. Aber ich weiß nicht, wie ich es nach dem Nachladen wieder zusammensetzen soll. Unten ist mein TestcodeWie mache ich meine Antwort einreichen weiterhin übereinander gestapelt

<!doctype html> 
<html> 
    <head> 



    <body onload="display()"> 

    <input type="text" id="Name"></input> 
    <input type="submit" id="submit" onclick="SavetoStorage()"></input> 


    <p id ="hoho"> 

    </p> 
    <script> 
     var name; 
     var groupOfName = ["Hello", "Chicken", "Pork","Beef"]; 
    function SavetoStorage() { 
     var name = document.getElementById("Name").value; 
     groupOfName[groupOfName.length] = name; 
     var newone = groupOfName; 
     document.getElementById("hoho").innerHTML = newone; 
     localStorage.groupOfName = newone; 

    } 


    function display() { 
     var groupOfName = localStorage.groupOfName; 
     document.getElementById("hoho").innerHTML = groupOfName; 
    } 







    </script> 
    </head> 
    </body> 


</html> 

Antwort

0

Sie müssen dynamisch die groupOfName Variable wie so geladen werden:

var tmp = localStorage.groupOfName; //this is a string 
var groupOfName = Array.from(tmp); //turn it into an array 

Hoffentlich hilft Ihnen in die richtige Richtung

+0

Ich bin nicht wirklich sicher, wie man es anwendet! Macht es dir etwas aus, mehr Anweisungen zu geben! Vielen Dank –

0

hinweisen, können Sie die setItem verwenden Methode aus dem lokalen Speicher. Es verwendet zwei Parameter:

  • einen Schlüssel und einen Wert

so können Sie etwas tun:

var inputValue = document.getElementById("Name").value; 
localStorage.setItem("name", inputValue); 

Der obige Code setzt den Schlüssel "name" und Schlüssel holds the inputValue

Jetzt können Sie den Wert abrufen, indem Sie eine andere lokale Speichermethode namens getItem aufrufen:

Der obige Code ruft das Element ab, und was hält dieses Element? der Wert von der Eingabe, so jetzt können Sie es zu Ihrem HTML hinzufügen, wie Sie wollen

Also das ist die Grundlagen, aber wie Sie nur 1 Eingang der Wert wird überschrieben werden, und LocalStorage unterstützt keine Arrays, aber es gibt eine Abhilfe, so dass Sie Arrays verwenden können, geht es etwa so:

//this first part converts your array to string 
localStorage.setItem("names", JSON.stringify(names)); 

//The second part returns your item and coverts it to an array again 
var storedNames = JSON.parse(localStorage.getItem("names"));