javascript - 使用 localstorage 重新加载页面时如何更新输入值？

Question

当用户在 input 元素中输入文本时，我希望能够保存他们键入的内容，以便在他们刷新时它仍会被缓存。

const input = document.getElementById('input')
input.onchange = function(){
  const key = input.value;
  localStorage.setItem('key', key)
  input.value = localStorage.getItem("key");
};

Answer 1

只需将值分配给事件处理函数之外的输入元素:

const input = document.getElementById('input')
input.value = localStorage.getItem("key"); // get and assign the value outside 
input.onchange = function(){
  const key = input.value;
  localStorage.setItem('key', key);
};

请注意:您也可以考虑使用oninput 而不是onchange。