输入数据保存到localStorage的按钮点击 [英] Save input data to localStorage on button click

问题描述

我想建立我的第一个Web应用程序。在我的应用程序我需要有一个设置面板，但我不知道该怎么做。我一直在寻找网页和跨HTML5本地存储，我相信可能会做的事情最好的办法就来了。但问题是我不知道如何使用它。

 ＆LT;输入类型=文本名称=服务器ID =saveServer/＆GT;
 

如何从输入数据保存到localStorage的，当用户点击这个按钮？像这样的事情？

 ＆LT;输入类型=文本名称=服务器ID =saveServer/＆GT;＆LT;按钮的onclick =save_data（）类型=按钮＆GT;保存/按钮＆GT;    ＆LT;脚本＆GT;
            功能SAVEDATA（）{
        localStorage.saveServer
        }
        ＆LT; / SCRIPT＆GT;
 

解决方案

的localStorage 对象有一个用来存储的项目的 setItem 方法。它需要两个参数 - 通过它可以指的是项目的关键，和值：

  VAR输入=的document.getElementById（saveServer）;
localStorage.setItem（服务器，input.value）;
 

以上code首先获取到输入元素的引用，然后存储在本地存储中的项目（服务器）的价值值该输入元素。

您可以通过调用的getItem 检索值：

  VAR储值= localStorage.getItem（服务器）;
 

I am trying to build my first web application. In my app I need to have a settings panel, but I have no idea how to do it. I've been searching the web and came across a HTML5 localStorage, which I believe might be the best way to do the things. But the problem is I have no idea how to use it.

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

How can I save data from input to localStorage when user clicks the button? Something like this?

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

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

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

解决方案

The localStorage object has a setItem method which is used to store an item. It takes 2 arguments - a key by which you can refer to the item, and a value:

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

The above code first gets a reference to the input element, and then stores an item ("server") in local storage with the value of the value of that input element.

You can retrieve the value by calling getItem:

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

这篇关于输入数据保存到localStorage的按钮点击的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！