0

是否可以使用一个表单构建一个纯 Html 页面（没有 php，没有 asp，没有服务器端），虽然只有 javascript，但在提交时会保留其选中的复选框？

更具体地说，当单击某些复选框时，我需要构建一个实时更新自身的表（就像 excel 对公式计算所做的那样）。我找不到存储复选框状态的方法，因为在每次页面刷新（表单提交操作）时，javascript 变量都会被重置。

4

3 回答 3

3

取自我在这里的回答

您的解决方案的假定答案是 localStorage()...

它依赖于 Javascript，绝对不是一个完美的解决方案，但HTML5 localStorage允许您在用户的计算机上存储首选项。

首先，检测对 localStorage() 的支持：

if (Modernizr.localstorage) { // with Modernizr
if (typeof(localStorage) != 'undefined' ) { // Without Modernizr

如果支持，则设置一个参数：

localStorage.setItem("somePreference", "Some Value");

然后再检索它，只要您的用户没有清除本地存储：

var somePreference = localStorage.getItem("somePreference");

当你想清除它时，只需使用：

localStorage.removeItem("somePreference");

对于那些使用不受支持（旧）浏览器的人，您可以使用 [本地存储黑客][2] 滥用 Flash LSO，但这些绝对不是理想的。

会话或 cookie 呢？

这两种都是有意的临时存储形式。即使是 Flash LSO 也比 cookie 更适合长期存储。

于 2013-08-08T16:13:18.057 回答
0

您有多种选择

您在浏览器中本地存储内容。如果用户清除了他们的缓存和本地存储，一切都消失了。

  • JavaScript Cookie

您不能使用会话，因为它们是服务器端的。但是，您可以使用 cookie 来存储/检索数据。见这里。

  • 将所有内容破解到 URL 中

您可以使用 HTML5 的推送状态事件更改 URL 。您将在需要更改的每个事件上附加参数“GET 请求样式”。

<script type="text/javascript">
    var stateObj = { foo: "bar" };
    function change_my_url()
    {
        history.pushState(stateObj, "page 2", "bar.html");
    }
    var link = node.getElementByID('click');
    link.addEventListener('click', change_my_url, false);
</script>

<a href="#" id='click'>Click to change url to bar.html</a>

就个人而言，我会使用 HTML5 本地存储。但请记住 - 如果用户使用缓存，您不能依赖他们拥有准确的数据。对于关键任务的东西，你真的应该使用服务器端语言（这就是它的用途）。

有用的链接：

于 2013-08-08T15:58:13.037 回答
0

使用 JavaScript，您可以只为复选框“检查”事件编写事件处理程序，因此不需要提交表单。

像 Knockout.JS 这样的库允许您根据计算“实时”更新表格等内容，而无需刷新页面。

于 2013-08-08T15:58:57.760 回答