关闭或隐藏带有 x 的信息框答案

【问题标题】：Closing or hiding an info box with an x关闭或隐藏带有 x 的信息框
【发布时间】：2014-10-02 18:01:30
【问题描述】：

我曾尝试寻找线索，但画了一大片空白。可能我在寻找错误的东西！

我在页面上创建了一个基本信息块。

我想让用户选择通过单击 x 来隐藏或关闭该框。

我假设我需要使用 cookie - 但不知道从哪里开始！也许 jquery，因为我在每个页面上都加载了其他元素？

一个重要的因素是它应该在显示新信息时重新出现。

这是怎么做到的？有人可以帮忙吗？

谢谢！

【问题讨论】：

能否请您发布您的代码，如果可能，请发布 jsfiddle 链接。
你也应该考虑阅读这样的东西htmldog.com/guides/javascript/beginner
您好，根据您的理解，这就是您要查找的内容：BootStrap Alert JS Fiddle
拉杰什 - 谢谢。不，我猜是相反的——这在很多网站上都有，欢迎来到 x 网站，右边的 x 隐藏该信息块。

标签： javascript jquery html css cookies

【解决方案1】：

你可以这样使用：

<div id="content" style="display:none;">
    <span class="close">&times;</span>
    Some text
</div>

<script>
    jQuery(document).ready(function(){
        if (!readCookie('messageClosed')){
            jQuery('#content').show();
        }
        jQuery('#content .close').click(function(){
            jQuery('#content').slideUp();
            createCookie('messageClosed', 1, 365);
            return false;
        });
    });
</script>

对于函数 readCookie 和 createCookie 看这个：https://stackoverflow.com/a/1460174/2828391

【讨论】：

【解决方案2】：

一旦您阅读了 Nicolas 为您链接的初学者 javascript 指南，也许还有 jQuery tut，您可能最终会写出这样的东西。

Javascript

jQuery('div.xbutton').click(function(){
jQuery('div.infoblock').hide();
});

HTML

<div class="infoblock">Information text <div class="xbutton">X</div></div>

但那是将来的事情，所以从阅读指南开始吧。这会很有帮助:)

【讨论】：