按钮单击将输入数据保存到localStorage

Question

我正在尝试构建我的第一个Web应用程序.在我的应用程序中,我需要一个设置面板,但我不知道如何做到这一点.我一直在网上搜索并遇到了一个HTML5 localStorage,我认为这可能是最好的方法.但问题是我不知道如何使用它.

<input type='text' name="server" id="saveServer"/>  

当用户单击按钮时,如何将数据从输入保存到localStorage？像这样的东西？

<input type='text' name="server" id="saveServer"/>  

<button onclick="save_data()" type="button">Save/button>

    <script>
            function saveData(){
        localStorage.saveServer
        }
        </script>

Answer 1

该localStorage对象具有setItem用于存储项目的方法.它需要2个参数:

1. 用于引用该项目的键

2. 一个值

   var input = document.getElementById("saveServer");
   localStorage.setItem("server", input.val());
   

上面的代码首先获取对input元素的引用,然后将一个项("server")存储在本地存储中,其值为该input元素的值.

您可以通过调用getItem以下方法检索值:

var storedValue = localStorage.getItem("server");