javascript - 使用 jStorage 设置和获取输入值

Question

我正在使用 jStorage当我单击保存按钮时存储输入的值。然后我想将存储的值设置为页面加载时的当前输入值。不过效果不是很好。

HTML

<input type='text' id='name'>
<div id="save">Save</div>

JS

$('#save').click(function() {
  $.jStorage.set("key", $("#name").val());
});

var input_value = $.jStorage.get("key");

Answer 1

有点纠结:

$.jStorage.set("key", $("#name").val());

var input_value = $.jStorage.get("key");

当您将一个选择器传递给 jQuery 时，您必须传递一个有效的字符串，而不仅仅是原始的 CSS 选择器语法。也就是说，您必须首先将选择器表达式放入 JavaScript，然后通过创建字符串常量来实现。

编辑 — 如果你想要你的 <input>要在页面加载时显示最后保存的值，您需要执行以下操作:

$(function() {
  $('#name').val( $.jStorage.get("key") || "" );
});

将事件包装在 $(function() { ... }) 中包装器确保代码在 <input> 之前不会运行字段已被浏览器看到和解析，但在用户看到页面加载后不久(基本上是立即加载)。

添加额外的 || "" jStorage 调用后的位确保如果值为 null或 undefined用户不会看到。如果没有存储值，换句话说，输入就是空的。当然，您可以在其中放置任何其他默认值。