Заменить существующий контент = локальное хранилище + существующий контент. Javascript, WebStorage, LocalStorage

Гм, я пытаюсь сохранить сообщения в "textBox" обратно в localStorage и добавить его к "logContent", но когда я обновил страницу, "logContent" все еще пуст с существующим только оригинальным контентом.

<body>

<div class="modal-body"> 
    <input id="textBox" type="text" placeholder="Type Message" onkeydown="if (event.keyCode == 13) {enterPressed();}">
    <p id="logContent">
            -- Logging is created --
    </p>
</div>

</body>

Вот мой Javascript, поэтому я хочу заменить оригинальный контент в "logContent" на textBox.value + оригинальный контент в logContent и заставить отображать все время, даже когда вы обновляете страницу. Спасибо.

var today = new Date(); 
var dd = today.getDate();
var mm = today.getMonth()+1; //January is 0
var yyyy = today.getFullYear();

if (dd < 10) {
dd ='0'+ dd
} 

if (mm < 10) {
mm ='0'+ mm
} 

today = dd + '/' + mm + '/' + yyyy;

function enterPressed() {
localStorage.setItem("logs", document.getElementById("textBox").value);
if (textBox.value == "") {

}
else {
var logText = today + ":" + " " + localStorage.getItem("logs") + '<br>';
$("#logContent").prepend(logText); // Prepend textBox's content to the top of  "logContent".
textBox.value = ""; // To clear the textBox after enter is pressed.
}
}

1 ответ

Решение

Оригинальный скрипт не предоставил средства для загрузки логов с localStorageи сохранил новый ввод под ключом "logs", в то время как намерение состояло в том, чтобы предварять. Решение довольно простое: загрузка из localStorage при загрузке страницы и перезапись localStorage['logs'] с содержанием logContents как показано на странице.

....

window.onload = function(){
    existing_log = localStorage.getItem("logs");
    console.log(existing_log);
    if (existing_log){document.getElementById("logContent").innerHTML = existing_log;}
}

function enterPressed() {
    if (textBox.value == "") {
        return;
    }
    else {
        var logText = today + ":" + " " + document.getElementById("textBox").value + '<br>\n';
        $("#logContent").prepend(logText); // Prepend textBox's content to the top of  "logContent".
        textBox.value = ""; // To clear the textBox after enter is pressed.
        localStorage.setItem("logs", document.getElementById("logContent").innerHTML);
    }
}
Другие вопросы по тегам