在jquery点击功能后保存当前状态 [英] Save current state after jquery click function

问题描述

我试图在点击另一个按钮后隐藏按钮，但是当页面刷新时，隐藏按钮会再次显示。我想保持隐藏，即使我刷新页面并仅在我点击显示按钮时显示它。
我们非常感谢任何帮助。

I am trying to hide a button after clicking another button but as when the page refreshed, the hidden button shows up again. I wanted to remain it hidden even if I refresh the page and show it only if I click the show button. Any help would be much appreciated.

HTML：

<button type="button" class="showhide">Show / Hide</button>
<button type="button" class="link">Link</button>

JS：

$('.showhide').click(function(){
 $('.link').hide();
});

推荐答案

像@Kartikeya所说，使用localStorage。

Like @Kartikeya said, use localStorage.

单击按钮时设置它。在页面加载时检查localStorage的值以更新按钮的可见性。

Set it when you click the button. On page load check the value of the localStorage to update the visibility of the button.

$('.showhide').click(function(){
    $('.link').toggle();

    var isVisible = $('.link').is(":visible"); 
    localStorage.setItem('visible', isVisible);
});

// stored in localStorage as string, `toggle` needs boolean
var isVisible = localStorage.getItem('visible') === 'false' ? false : true;
$('.link').toggle(isVisible);

https://jsfiddle.net/undm500w/8/

这篇关于在jquery点击功能后保存当前状态的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！