为每个访问者显示一次jQuery弹出窗口

Question

如何让此脚本仅在该用户是站点的新访问者时才运行？每次请求页面时，它都会运行，这会变得非常烦人。

//0 means disabled; 1 means enabled;
var popupStatus = 0;

function loadPopup(){
    //loads popup only if it is disabled
    if(popupStatus==0){
        $("#backgroundPopup").css({
            "opacity": "0.7"
        });
        $("#backgroundPopup").fadeIn("slow");
        $("#popupContact").fadeIn("slow");
        popupStatus = 1;
    }
}

//disabling popup with jQuery magic!
function disablePopup(){
    //disables popup only if it is enabled
    if(popupStatus==1){
        $("#backgroundPopup").fadeOut("slow");
        $("#popupContact").fadeOut("slow");
        popupStatus = 0;
    }
}

//centering popup
function centerPopup(){
    //request data for centering
    var windowWidth = document.documentElement.clientWidth;
    var windowHeight = document.documentElement.clientHeight;
    var popupHeight = $("#popupContact").height();
    var popupWidth = $("#popupContact").width();
    //centering
    $("#popupContact").css({
        "position": "absolute",
        "top": windowHeight/2-popupHeight/2,
        "left": windowWidth/2-popupWidth/2
    });
    //only need force for IE6

    $("#backgroundPopup").css({
        "height": windowHeight
    });

}


$(document).ready(function(){

    //LOADING POPUP
    //Click the button event!
        //centering with css
        centerPopup();
        //load popup
        loadPopup();

    //CLOSING POPUP
    //Click the x event!
    $("#popupContactClose").click(function(){
        disablePopup();
    });
    //Click out event!
    $("#backgroundPopup").click(function(){
        disablePopup();
    });
    //Press Escape event!
    $(document).keypress(function(e){
        if(e.keyCode==27 && popupStatus==1){
            disablePopup();
        }
    });

});

Answer 1

将cookie设置为在会话结束时过期，其值为1或true或其他值。然后去找曲奇。如果它存在，就不要显示它。

Answer 2

如前所述，您需要在用户第一次看到页面时创建一个cookie，然后在其他访问时检查该cookie是否存在。

创建Cookie的JavaScript并不像它应该的那样简单，因为您需要使用精确的格式设置字符串。使用这些helper functions that can be found on Quirksmode会更容易

function createCookie(name,value,days) {
    if (days) {
        var date = new Date();
        date.setTime(date.getTime()+(days*24*60*60*1000));
        var expires = "; expires="+date.toGMTString();
    }
    else var expires = "";
    document.cookie = name+"="+value+expires+"; path=/";
}

function readCookie(name) {
    var nameEQ = name + "=";
    var ca = document.cookie.split(';');
    for(var i=0;i < ca.length;i++) {
        var c = ca[i];
        while (c.charAt(0)==' ') c = c.substring(1,c.length);
        if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
    }
    return null;
}

那么在你的代码中，你需要做的就是：

if(readCookie("popupShown") == null) {
    // Create cookie for 30 days
    createCookie("popupShown", 1, 30);
    yourPopupFunction();
}

Answer 3

如果您想要一个纯客户端方法，则使用Use cookies。设置一个标志，表明用户已经看过你的介绍或其他内容。

在使用某种身份验证的站点的情况下，这可以由服务器处理。

愿上帝保佑你!