簡體   English   中英

重新加載頁面時,以前的評論消失了-與本地存儲有關

[英]When I reload the page my previous comments disappear - something to do with local storage

嘗試使之刷新頁面時,以前的注釋會保留在頁面上。 不太清楚該怎么做。 也想知道如何制作它,這樣當您單擊名稱框時,不必突出顯示“名稱”,然后寫下您的名稱,您只需單擊即可,您編寫的內容將簡單地替換為“名稱”。

//Functions for Homepage
function imgUpdate() {
    var img = document.getElementById("navImg").alt;
        if (img === "Cat Selfie") {
            document.getElementById("navImg").src = "foo.jpg";
            document.getElementById("navImg").alt = "foo"
        }
        else {
        document.getElementById("navImg").src = "cat-selfie.jpg";
        document.getElementById("navImg").alt = "Cat Selfie"
        }
}

//Functions for Comments
function clearComment(){
    $('#txt1').val(''); //short for getElement when using j query
};

function clearName(){
    $('#namebox').val('');
};

function saveComment() {
    var ctext = $('#txt1').val();
    var cname = $('#namebox').val();
    if (cname === 'Name') {cname = 'Anon';}
    alert('saveComment cname=' + cname + ' ctext=' +ctext);
    var d = Date();
    var prevComments = $('#cmtlist').html();
    var curComment='<p><span class="cmtname">'+cname+ ':' + '</span>'
        +ctext +d+' </p>'; //span = add things to something  inline
    curComment += prevComments;
        $('#cmtlist').empty();
        $('#cmtlist').append(curComment);
    clearComment();
    clearName();

    setObject('totCmts', curComment);
}



function fetchComments(){
    var inlist=getObject('totCmts');
        if(inlist === null){
            inlist='';
        }
    //display the comments
        $('#cmtlist').empty();
        $('#cmtlist').append(inlist);
}

我的HTML文件

<html>
<head>
<meta charset="utf-8" />
<title>Dubya comments</title>
<link rel="stylesheet" href="homepage.css" type="text/css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="homepage.js"></script>
</head>
<body>
<header id="banner">
</header>
<nav>
<button type="button" onclick="clearComment()">Clear
comment</button> 
<button type="button" onclick="saveComment()">Save comment</button>
</nav>
<div id="main">
<div id="dtext">
<h4>Your comment</h4>
<input id="namebox" type="text" maxlength="32" size="20"
value="Name" />
<br />
<textarea id="txt1" class="textbox" rows="6"></textarea>
</div>
<h4>Comments</h4>
<div id="cmtlist"></div>
</div>
</body>

</html>

傑克,您可以使用全局對象輕松將數據存儲在localStorage中,如下所示:

// your array with comments
var comments = ["First comment", "Second comment"];

// saving your comments in JSON format
window.localStorage.setItem("comments", JSON.stringify(comments));

// retrieving them
comments = JSON.parse(window.localStorage.getItem("comments"));

您可以在MDN上閱讀有關localStorage的更多信息

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM