如何从输入字段获取值并存储在本地存储中并在javascript中显示到表中

时间:2017-09-24 23:33:13

标签: javascript css html5

如何从输入数据获取值并存储在本地存储中并在javascript中显示到表中

<html>
    <head>
        <title></title>
    </head>
    <body>
    <label>Name</label>
    <input type="text">
    <label>Last Name</label>
    <input type="text">
    <table>
    <tr>
        <th>Name</th>
        <th>Last Name</th>
    </tr>

    </table>
    </body>
    </html>

1 个答案:

答案 0 :(得分:1)

试试这个,

<html>
    <head>
        <title></title>
    </head>
    <body>
    <label>Name</label>
    <input id="name" type="text">
    <label>Last Name</label>
    <input id="last" type="text">
    <table>
    <tr>
        <th>Name: <label class="name"></label></th>
        <th>Last Name: <label class="last_name"></label></th>
    </tr>

    </table>
    <button id="transfer">Transfer</button>
    </body>
    </html>

使用Jquery

$(function(){
  $('#transfer').on('click',function(){
   localStorage.setItem('name', $('#name').text());
   localStorage.setItem('last', $('#last').text());
   $('.name').text(localStorage.getItem('name'))
   $('.last_name').text(localStorage.getItem('last'))
 })

});

存储在本地存储中:JQuery setting a local storage variable

在本地存储中获取数据:Getting the value of a variable from localStorage from a different javascript file

希望这有帮助:)