添加的课程没有被记住

Question

我有一个带有2个按钮的导航，当点击一个按钮时它会加载一个新页面（新页面加载），当点击该按钮时，应该添加一个选择了classname的类... 它部分地做了 - 它添加了类，但是当它加载新页面时，该类又被删除了吗？如何使课程坚持用户点击的内容？

$(document).on("click", ".list-mode button", function () {
    $(".list-mode button").removeClass("selected");
    $(this).addClass("selected");
});

Answer 1

如果您要导航到新页面，则使用JavaScript对当前页面所做的更改不会显示在新页面中。你真的有三个选择：

1. 使用服务器端代码将正确的类添加到新页面的HTML中的正确元素。
2. 在新页面中使用JavaScript将正确的类添加到正确的元素中;你需要一种方法来确定应该将类添加到哪个元素（可能是新页面的URL的一部分）。
3. 使用AJAX导航，而不是加载一个全新的页面，只需加载新内容并替换已加载页面的一部分。

Answer 2

您需要cookie或DOM存储。

每当页面被放弃时，您需要存储用户上次执行的操作并使用存储的设置初始化整个按钮。

当你使用jQuery时，处理document.ready事件并在加载页面时初始化按钮：

$(document).ready(function() {
   // Initialize the whole buttons
});