我使用jquery创建输入字段，刷新页面后如何保持这个“新输入值”的存在

I create input field using jquery, how can keep this ' new input value ' exist after refresh page

本文关键字：输入 新输入 存在 新输入值 创建 字段 jquery 刷新 何保持      更新时间：2023-09-26

我使用jquery创建输入字段，刷新页面后如何保持这个"新输入值"存在

代码是

function onMyButtonclick() 
        {   var a =$('#addItem').val()
            $('#resultList').append('<li>'+a +'</li>');
            $('#addItem').val("");
        }
<input type="button"  value="add" onClick="onMyButtonclick();">
<ol id="resultList">
    <li>just example</li>
</ol>
</form>

解决方案是如此重要..

您必须了解，在页面刷新时，DOM 会再次重建，因此没有直接的方法可以在页面刷新后存在此"新输入值"，因为它是在用户交互时以编程方式添加到 DOM 中的。

但尽管如此，浏览器中还有其他机制可用于在页面刷新时保留信息。您有 cookie 和其他与存储相关的功能集，包括本地存储、会话存储、全球存储。您可以在此处阅读有关这些功能的信息 DOM 存储指南。对于您的情况，本地存储是最合适的。

因此，基本上您需要的解决方案是修改onMyButtonClick函数以存储有关已添加到上述任何浏览器持久性机制中的输入项的信息。当页面在刷新时再次加载时，您将编写一个新函数，该函数采用您存储的信息以再次生成输入元素。

我还建议您阅读以下文章：WEB应用程序本地存储的过去，现在和未来

使用 localstorage

var data = JSON.parse(localStorage.getItem('a')) || [];
//do something with data array
data.push($('#addItem').val());
localStorage.setItem('a', JSON.stringify(data));
相关文章：