Question

我已经使用这些代码制作了一个简单的笔记应用程序。它必须通过按下“记住”按钮将文本框值存储到localStorage中。然后显示它，但按下另一个按钮。但它不起作用。

<HTML>

<head>
    <script>
        function myfunction1() { //remember code var
            texttosave = document.getElementById('textline').innerHTML;
            localStorage.setItem('mynumber', texttosave);
        }

        function
        myfunction2() { //recall code
            document.getElementById('recalledtext').innerHTML =
                localStorage.getItem('mynumber');
        }
    </script>
</head>

<body>
    <input type="text" id="textline" />
    <button id="rememberer" onclick='myfunction1()'>remember text</button>
    <button id="recaller" onclick='myfunction2()'>recall text </button>
    <p id="recalledtext">Loading</p>
</body>

</HTML>

Answer 1

输入文字时，<input>元素的.innerHTML属性不会更改。要查看当前输入到输入框的内容，必须使用其.value属性。

就这样

texttosave = document.getElementById('textline').innerHTML ;

需要成为

texttosave = document.getElementById('textline').value ;

那应该这样做。

您稍后也会链接到您的测试网站。那里的代码是

function myfunction1(){ //remember code texttosave = ..........

但这使得texttosave = ..........成为评论的一部分。你需要写

function myfunction1(){ //remember code
    texttosave = ..........

现在您已将texttosave = ......放在单独的一行，因此不会将其视为评论的一部分。

或者，如果您不想插入换行符以保持代码简洁，请删除评论（//remember code，//recall code），然后您可以将它们保持在同一行。< / p>

另一种方法是将单行注释（例如// remember code）替换为您在同一行关闭的多行注释（即/* remember code */）

将数据保存到localstorage并将其显示为innerHTML

1 个答案: