Javascript 弹出窗口未按需要在每个会话中显示一次（如客户所述）

我正在尝试获得一个弹出窗口，以便在每次会话加载时显示一次。从我的角度来看，这一切都很正常，但我的客户说，即使在重新启动浏览器并清除缓存后，他在第一次之后也看不到这一切

下面的代码是否需要更改？此外，我无法用触摸键单击手机上的关闭按钮。如何使弹出窗口关闭响应触摸

HTML

<div id="popup-wrap">
    <div id="popup">
        <div id="popup-close">&times;</div>
        <a href="http://google.com/" target="_blank">
            <img src="image.jpg" width="100">
        </a>
        <h2>We are featured this month in Architectural Digest!</h2>
        <a href="http://www.architecturaldigest.com/" target="_blank">Read the article &raquo;</a>
    </div>
</div>

CSS

if (localStorage.getItem('popState') != 'shown'){
    $("#popup-wrap").delay(2000).fadeIn();
    localStorage.setItem('popState','shown')
}

$('#popup-close').click(function(e) {
    e.preventDefault();
    $('#popup-wrap').fadeOut(); // Now the pop up is hidden.
});

#popup-wrap {
    background: #fff;
    box-shadow: 1px 0 3px #999;
    display: none;
    font-family: 'montserrat', sans-serif;
    height: 210px;
    left: 50%;
    margin-left: -250px;
    margin-top: -105px;
    opacity: .8;
    position: absolute;
    text-transform: uppercase;
    top: 50%;
    width: 500px;
    z-index: 11;
}

#popup {
    padding: 40px;
    position: absolute;
}

#popup-close {
    cursor: pointer;
    font-size: 36px;
    position: absolute;
    right: 10px;
    top: 0;
}

#popup img {
    float: left;
    margin-right: 20px;
}

#popup h2 {
    color: #222;
    font-size: 20px;
    margin-bottom: .5em;
}

#popup a {
    font-size: 12px;
    text-decoration: none;
}

---

您可以尝试将

本地存储

更改为

会话存储

localStorage

用于长期使用，其中as

sessionStorage

更为短期。一些答案进一步解释了它们

它只显示一次，直到您清除缓存或重新启动浏览器

同时，我还可以用小提琴关闭手机弹出窗口

---

希望这有帮助。

谢谢，我会尝试将其切换到

会话存储

。不过，我仍然无法在手机上触摸“关闭盒子”。你介意看看你是否可以在手机上关闭它吗？我仍然可以在手机上关闭它，我使用了两种不同的浏览器（手机标准浏览器和Chrome浏览器）都可以。什么样的电话导致了问题？是不是只有你的手机有这个问题？你的手机有没有可能是iPhone？我的iPhone 5s和Safari不兼容。我有一个三星Galaxy Note 4，让我做一些挖掘。我会告诉你我发现了什么。查看@Mike Barwick answer，他提供了一些跨平台工作的javascript。