javascript - 如何从textarea保存到localStorage?

标签 javascript html google-chrome-extension local-storage

我正在尝试将输入的电子邮件保存到 localStorage 中的文本区域。我在加载页面时看到占位符“您的 gmail 地址”,但是当我输入一个值并单击“保存”时,没有任何反应。我没有看到验证文本已保存的警报或控制台。我做错了什么?

<html>
<head><title>Extension Options</title></head>
<body>
<textarea id="user" style="margin-bottom: 4px; width: 250px; height: 20px">
</textarea><br />
<button id="save">Save</button>
<!--<button id="save">Clear</button>-->

<script type="text/javascript">

//check if "user" is in localStorage

if (localStorage["user"])
{
    var user = localStorage["user"] ;
    document.getElementById("user").value = user ;
    alert("you are already a user")
}
else
{
    document.getElementById("user").placeholder = "your gmail address" ;
    console.log("user no found in localStorage")
}

//save entered gmail address
document.getElementById("save").addEventListener
{
    "click", function ()
    {
        var user = document.getElementById("user").value ;
        //localStorage["user"] = user ;
        localStorage.setItem("user", user) ;
        alert("gmail id saved") ;
        console.log("gmail id saved")
    } , false
}

</script>
</body>
</html>

最佳答案

您的 addEventListener 函数使用不当。应该这样使用:

document.getElementById("save").addEventListener("click", function ()
    {
        var user = document.getElementById("user").value ;
        //localStorage["user"] = user ;
        localStorage.setItem("user", user) ;
        alert("gmail id saved") ;
        console.log("gmail id saved")
    } , false);

MDN docs on element.addEventListener

Working demo with your code

关于javascript - 如何从textarea保存到localStorage?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7892446/

相关文章:

javascript - Node js reSTLer 在发出 2 个不同的 API 请求时返回相同的结果

javascript - 如何获取从 angularjs 范围动态到达表的 <td> 值?

html - 使用 css 不显示图片

html - 移动设备的响应式 GIF 背景

javascript - 如何将元素个性化为唯一标识符?

javascript - 使用 Knockout 从 JSON 预填充选定值以进行多项选择

javascript - 一个实例的对象和数组被 Backbone 模型的新实例引用

html - 如何在 <li> 标签中排列图像、h1 标签和 span?

google-chrome-extension - 为什么 chrome.downloads.download 在不添加另一个函数的情况下不起作用。(当在它后面添加alert() 时它就起作用了)

javascript - 这段代码工作正常吗?我想获取以下日期的时间戳