如何在不同的页面上保持按钮状态？ [英] How to keep button state across different pages?

问题描述

当我点击时，我将禁用属性分配给按钮：

When I do a click, I assign a disabled attribute to the button:

$(".save_post").on("click", function() {
    $(this).attr("disabled", "true");
});

然而，如果我改变页面然后我回到这个，那么按钮应该保持禁用状态给定属性，如果我使用localStorage就可以了：

However, if I change page and then I go back to this one, the button should keep the disabled attribute given, this is fine if I use localStorage:

localStorage.setItem("savedArticle", "savedButton");
var myButtonState = localStorage.getItem("savedArticle", "savedButton");
$(".save_post").addClass(myButtonState);

但是，我有不同的页面可以有< button type =按钮class =save_post> SAVE< / button> 所以每次点击一个按钮，都会给出已禁用的属性，但是如果我使用上面的 localStorage ，它会将 myButtonState 添加到类的所有按钮。 save_post 每次我们登陆它的页面。

However, I have different pages which can have <button type="button" class="save_post">SAVE</button> so each time I click on a button, a disabled attribute is given, but if I use the localStorage like above, it will add myButtonState to all buttons with class .save_post each time we land on a page with it.

我试图只将属性添加到真正点击的按钮。

I am trying to add the attribute only to the buttons really clicked.

推荐答案

只需为每个 .save_post 元素分配一个ID：

Just assign an ID to each .save_post element:

<button id="savePost1" class="save_post">Save Post</button>

然后引用ID：

$('.save_post').on('click', function() {
    $(this).attr("disabled", "true");
    localStorage.setItem('saveButton', $(this).attr('id'));
});

然后在加载时调用它：

$('#'+localStorage.getItem('saveButton')).attr('disabled', true);

这篇关于如何在不同的页面上保持按钮状态？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！