javascript - 如何添加一个 'don' t show this message again' checkbox with localstorage？

Question

我有一个引导警报。

<div class="checkbox">
    <label>
        <input type="checkbox"> Don't show this again!
    </label>
</div>

如果复选框被点击并且警报被解除

<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>

我不想再显示警报。我想知道这是否可以用 http://www.w3schools.com/js/js_cookies.asp

$('#checkbox').click(function() {
    if ($('#checkbox').attr('checked')) {
        document.cookie="alert=dismiss";
    }
})

然后如果有 cookie 隐藏消息 $.hide 方法？

更新了解决方案

var oldBrowser = $.browser.msie && parseInt($.browser.versionNumber) < 9;

//message is dismissed via storage
var dissmissed = amplify.store("DoNotShowMessageAgain");

// if oldbrowers and not dismissed
if (oldBrowser && !dissmissed) {
     $( "#browserAlert" ).show();
}


// Don't show message again
$('#browserAlert .close').click(function(){
if ($('.checkbox input').is(':checked')) {
     amplify.store( "DoNotShowMessageAgain", true );
 }
}) 

Answer 1

我的建议是为此使用 HTML5 的本地存储。它的真正目的是一种在浏览器的 session 之间持久保存数据而不会过期的现代方法:

function localStorageAvailable() {
    if (typeof(Storage) !== "undefined") {
        return true;
    }
    else {
        return false;
    }
}

$('#checkbox').click(function(){
    if ($('#checkbox').attr('checked')) {
        if (localStorageAvailable())
            localStorage.DoNotShowMessageAgain = "true";
    }
}) 

然后，当页面准备就绪时，您可能想要检查并恢复过去保存的体验中的功能:

if (localStorageAvailable()) {
    if (localStorage.DoNotShowMessageAgain && localStorage.DoNotShowMessageAgain === "true") {
        // user doesn't want to see the message again, so handle accordingly
    }
};

有关 HTML5 本地存储的更多信息，请查看 my blog post关于这个话题。