如何在Phonegap中刷新后保存输入数据

问题描述 投票:0回答:1

我正在使用Phonegap创建一个应用程序,让用户记下他们在健身房做过的练习。问题是当用户添加另一个集合或练习时,先前输入中的数据被删除...

HTML:

<div id="exersice-holder" class="exersice-holderStyle">
<div class="exersice">
    <table style="width:100%" id="table-1">
    Exercise: <input placeholder="Input exersice" class="enter-Exercise"></input>
    <tr style="color:white">
        <th>SET</th>
        <th>GOAL</th>
        <th>ACHIEVED</th>
    </tr>
    <tr style="color:white">
        <td class="set">1</td>
        <td><input class="input" value="x"></input></td>
        <td><input class="input" value="kg x reps"></input></td>
  </tr>
    </table>
    <div class="plusSet" onclick="addTableRow(1, 2)" id="table-plus-set-1">+</div>
</div>
    <div class="plusExersice" onclick="addTableExersice(1, 2)" id="table-plus-exersice-1">+</div>
</div>

JS:

function addTableRow(id, set)
    {
        document.getElementById('table-' + id).innerHTML += '<tr style="color:white"><td class="set">'+set+'</td><td><input class="input" style="left:25%" value="x"></input></td><td><input class="input" style="left:60%" value="kg x reps"></input></td></tr>';
        document.getElementById('table-plus-set-' + id).onclick = function() { addTableRow(id, set + 1); };
    }
    function addTableExersice(id, exersice)
    {
        document.getElementById('exersice-holder').innerHTML += '<div class="exersice"><table style="width:100%" id="table-'+exersice+'">Exercise: <input placeholder="Input exersice" class="enter-Exercise"></input><tr style="color:white"><th>SET</th><th>GOAL</th> <th>ACHIEVED</th></tr><tr style="color:white"><td class="set">1</td><td><input class="input" style="left:25%" value="x"></input></td><td><input class="input" style="left:60%" value="kg x reps"></input></td></tr></table><div class="plusSet" onclick="addTableRow('+exersice+', 2)" id="table-plus-set-'+exersice+'">+</div></div>';
        document.getElementById('table-plus-exersice-1').onclick = function() { addTableExersice(id, exersice + 1); };
    }

CSS:

.input
{
    width:100%;
    text-align:center;
}
.set
{
    font-size:20px;
}
.exersice
{
  width: 100%;;
  height: auto;
  top:20%;
  left: 0%;
  color:white;
  border: 1px solid white;
  margin-bottom:20px;
  margin-left: 2px;
}
.exersice table
{
    color:white;
}
td
{
    text-align:center;
}
.plusSet
{
    font-size:30px;
    text-align:center;
    cursor:pointer;
}
.plusExersice
{
    font-size:30px;
    text-align:center;
    cursor:pointer;
    color:white;
    width: 100%;
}
.enter-Exercise
{
    width:70%;
}
.exersice-holderStyle
{
    text-align:center;
    width: 100%;
}

我可以用某种方式在<'script'>中写一些内容,使输入数据在onclick tableExercise / tableRow之后保留吗?

我很感激任何帮助:) PS。我对此很新,所以如果代码有点乱,我很抱歉...

javascript html input save phonegap
1个回答
0
投票

这可能有助于您在Phonegap javascript脚本中保存值:本地存储

设定值

localStorage.setItem("mytime", Date.now()); 

读取价值

var x = localStorage.getItem("mytime"); 

文件

https://www.w3schools.com/jsref/obj_storage.asp

© www.soinside.com 2019 - 2024. All rights reserved.