Question

我使用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>

解决方案非常重要..

Answer 1

你必须明白，在页面刷新时，DOM会再次重建，因此在页面刷新后没有直接的方法让这个“新输入值”存在，因为它是以编程方式在用户交互时添加到DOM中的。

但是不能承受，浏览器中还有其他机制可用于在页面刷新时保留信息。您有cookies和其他一组存储相关功能，包括localStorage，sessionStorage，globalStorage。您可以在DOM Storage Guide阅读有关这些功能的信息。根据您的情况，LocalStorage最合适。

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

我还建议你阅读文章：THE PAST, PRESENT & FUTURE OF LOCAL STORAGE FOR WEB APPLICATIONS

Answer 2

使用localstorage

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

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

2 个答案: