jQuery，在一个页面中设置项目，在另一个页面中显示它

Question

我有一个带有名为“workArea”的文本框的 HTML 页面：

<button id="saveWork">Save Your Work</button>

<textarea id="workArea" cols="80" rows="40">
User edits text here.
</textarea>

我想在用户点击“saveWork”按钮时使用jQuery：

1. 将按钮更改为确认用户的工作已保存（正在工作）
2. 将文本框“workArea”中的值保存到“workData”下的本地存储（不工作）

var saveConfirm = "您的工作已保存！";

$("#saveWork").click(function() {

 $('#saveWork').replaceWith(document.createTextNode(saveConfirm)).show();

 localStorage. setItem ('workData',document.getElementById('workArea').value);

});

然后，在一个新的 HTML 页面上，在另一个文本框中的“workArea”中显示保存的值，供用户继续工作。

我认为这与将其放在新 HTML 页面上的脚本标记中有关...

$(document).ready(function() { localStorage.getItem('workData'); });

我无法让新的 HTML 页面显示任何内容。

我哪里错了？

谢谢！

Answer 1

这是一个Demo Fiddle

$('#Output').val(localStorage.getItem('workData'));

点击“保存工作”后刷新页面，您将在小文本区域中获得输出。