Question

我是jQuery的新手，我的网站上有一些需求。我想在第一次显示jQuery div弹出窗口时才会出现。无需一次又一次地展示。

我仍在使用这个，但我不知道如何隐藏第二次：

var isshow=0;
$(document).ready(function() {
   if (isshow == 0) {
     $('#jPopup').show();
   }
   isshow = 1;
});

但ishow变量每次都会初始化。

Answer 1

您可以使用localstorage。它易于理解和使用。

$(document).ready(function() {
    var isshow = localStorage.getItem('isshow');
    if (isshow== null) {
        localStorage.setItem('isshow', 1);

        // Show popup here
        $('#jPopup').show();
    }
});

首次访问您的网站时会显示弹出窗口。

Answer 2

您可以根据需要使用SessionStorage或LocalStorage。

如果您只需要为该会话执行，请使用SessionStorage。如果它应永久存储在用户的浏览器中，请使用LocalStorage。

    $(document).ready(function(){
        if(sessionstorage && !sessionStorage.getItem('isshow')){
            $('#jPopup').show();
            sessionStorage.setItem('isshow', true);
        }
    });

Answer 3

您可以将localStorage用于此目的，如下所示：

$(document).ready(function(){
   var shown= localStorage.getItem('isshow');
    if(shown !="t"){
        $('#jPopup').show();
        localStorage.setItem('isshow', "t");
    }
});

Answer 4

您可以设置一个cookie来存储一个值并检查它是否未设置然后显示弹出窗口：

$(document).ready(function() {
    var isshow = $.cookie("isshow");
    if (isshow == null) {
        $.cookie("isshow", 1); // Store

        // Show popup here
        $('#jPopup').show();
    }
});

或者您可以设置localStorage。这是一个有效的例子。 jsFiddle

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

Answer 5

您需要在加载时隐藏它或在css（推荐）中执行它，然后检查localstorage以查看它是否是第一次访问。

$(document).ready(function() {
        $('#jPopup').hide(); //hide on load or in css, later check if its the first visit
        var isshow= localStorage.getItem('status');
        //check if it is the first visit
        if (isshow == null || isshow == '') {
            //set variable to 1
            localStorage.setItem('isshow', 1);
            $('#jPopup').show();
        }
        });

仅在首次访问页面时显示jQuery弹出窗口

5 个答案: