javascript - 仅显示一次弹出消息

Question

我有一条弹出消息，每次用户访问我的网页时都会显示该消息。这很烦人，我只想显示一次弹出消息。怎么做？

<script>
    $(document).ready(function () {
        $("#popup").hide().fadeIn(1000);
        //close the POPUP if the button with id="close" is clicked
        $("#close").on("click", function (e) {
            e.preventDefault();
            $("#popup").fadeOut(1000);
        });
    });
</script>

<!-- Pop up message -->
<link href="myhome/popup.css" rel="stylesheet" type="text/css"/>
<div class="body-popup" style="height: 100%; width: 100%; background-color: black">
    <div id="popup">
        <div id="close" class="alert alert-info alert-dismissable">
            <button type="button" class="pull-right close" data-dismiss="alert" aria-hidden="true">&times;</button>
            CLOSE
            <img src="/myhome/assets/img/prom.jpg" alt="popup" class="image-pop"/>
        </div>
    </div>
</div>
 

Answer 1

一旦他们看到它，将其保存在 localStorage 中。

$(document).ready(function () {
    const popup = $("#popup");
    popup.hide()
    if (localStorage.seenPopup) return;
    popup.fadeIn(1000);
    //close the POPUP if the button with id="close" is clicked
    $("#close").on("click", function (e) {
        e.preventDefault();
        $("#popup").fadeOut(1000);
        localStorage.seenPopup = 'true'; // value doesn't matter as long as it's not falsey
    });
});