Question

我有一个html页面，这些是代码：

<script>

$(document).ready(function(){
  $("h4").click(function(){
    $(this).html("read");
  });
});

</script>


{% for data in collecteddata %}
    <div align="center" class="box">{{ data }}</div><h4>unread</h4>
{% endfor %}

例如我点击“未读”并且它变成“读取”但是当我刷新页面时它再次变成“读取”。对不起，这可能是一个愚蠢的问题，但我如何在我的html页面上保存jquery效果？编辑：我不是在本地服务器，我使用jinja，我没有数据库。我只使用jinja和python。

Answer 1

您必须在某处存储（保留）已修改的数据。使用对服务器的AJAX请求将消息标记为已读（如您的情况）。

或者您可以使用localStorage / sessionStorage（称为Web Storage）将数据存储在浏览器中。请注意，用户可以更改此数据，因此不应将敏感信息存储在Web Storage中。

另一个令人兴奋的新事物是IndexedDB，它的行为有点像客户端的SQL数据库。

Answer 2

由于您要保存事件效果，因此您必须存储事件的数据。可以使用的存储是：

数据库[网站]
浏览器数据库[localstorage]
使用Cookie

你需要做的基本事情就是在事件中保存三个数据，然后在重新加载时读取数据并根据存储的数据更改值。

Answer 3

尝试HTML5's localStorage方法：

$(document).ready(function () {
    $("h4").html(localStorage.read);
    $("h4").click(function () {
        $(this).html("read");
        localStorage.read = 'read';
    });
});

演示：http://jsfiddle.net/8MGmV/

然而，还有其他方法可以实现此目的，例如数据库和使用存储在服务器上的文本文件。

Answer 4

jQuery每次在重新加载时重置变量时都会使用dom重新加载。如果需要长期存储数据，可以将设置保存到数据库，或者如果短期需要，可以将数据保存为cookie。

如何通过更改jquery来保存html页面？

4 个答案: