如何在localstorage中添加"不再显示此消息"复选框?

nol*_*awi 3 javascript jquery twitter-bootstrap-3

我有一个引导警报.

<div class="checkbox">
    <label>
        <input type="checkbox"> Don't show this again!
    </label>
</div>
Run Code Online (Sandbox Code Playgroud)

如果单击该复选框并且警报被取消

<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
Run Code Online (Sandbox Code Playgroud)

我不想再次出现警报.我想知道这是否可以通过http://www.w3schools.com/js/js_cookies.asp完成

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

然后,如果有一个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 );
 }
}) 
Run Code Online (Sandbox Code Playgroud)

Tho*_*ger 5

我的建议是使用HTML5的本地存储.它的目的是在没有过期的浏览器的会话之间保持数据的现代方法:

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

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

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

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

有关HTML5本地存储的更多信息,请查看关于该主题的博客文章.