Javascript - html 本地存储 - 将文本输入存储和调用为变量答案

【问题标题】：Javascript - html local storage - Store and recall text input as a variableJavascript - html 本地存储 - 将文本输入存储和调用为变量
【发布时间】：2014-11-09 06:05:52
【问题描述】：

这是我的html页面的基本结构。点击

rememberer ，将输入文本框中的数据作为字符串存储到本地存储中。点击

调用者，将存储的数据加载到

召回文本。我正在开发这个以用于 Phone Gap。

<input type="text" id="textline" />

<p id="rememberer" onclick='myfunction1()'>remember text</p>
<p id="recaller" onclick='myfunction2()'>recall text</p>

<p id="recalledtext" >Loading</p>

代码如下

function myfunction1(){
//remember code
var texttosave = document.getElementById('textline').innerHTML ;
localStorage.mynumber = texttosave;
}


function myfunction2(){
//recall code
document.getElementById('recalledtext').innerHTML = localStorage.mynumber; 
}

我很困惑为什么这段代码不起作用。另外我需要知道我是否可以单独使用此代码而不使用 phoneGap API 来存储即使在会话关闭并稍后打开之后也可以调用的数据。

请分享您的经验。

【问题讨论】：

输入没有innerHtml。了解如何使用基本的 javascript 调试工具
使用innerHTML 也有潜在的陷阱。
@Andy 你能告诉我这些陷阱是什么
我写的“innerHTML”部分有一个链接。

标签： javascript android html cordova local-storage

【解决方案1】：

查看documentation 的会话和本地存储 - 它定义了获取和设置存储密钥的方法

您将要像这样使用setItem 和getItem：

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'); 
}

还有一些其他有用的方法，例如removeItem(key)

这适用于 Phonegap API 以及标准浏览器实现 - 如果支持 window.localStorage

【讨论】：