Question

我创建了一个弹出窗口，当用户滚动到页面的某个部分时触发该窗口：

  if(localStorage.getItem('popState') != 'shown'){
    var modalwaypoint = $('#learning').waypoint({
      handler: function(direction) {
        if (direction == 'down') {
          $('#modalwaypoint').foundation('open');
          localStorage.setItem('popState','shown')
        }
        this.destroy()
      },
      offset: '10%'
    });
  }

我认为当有人查看页面时，他们可能会首次删除弹出窗口，但回到页面并再次看到弹出窗口时，他们可能更愿意点击CTA。

我想保留localStorage方法，但允许弹出框在x小时或数天之后再次显示，然后再显示。我是javascript的新手，所以仍然试图了解它，任何人都可以帮忙吗？

非常感谢

snarf1974

Answer 1

使用localStorage为什么不在存储popState的同时设置类似以下的内容？

localStorage.setItem('popupLastShown', new Date().getTime());

然后你可以

检索弹出窗口的最后一次显示
决定是否应该再次显示
如果您显示，请存储新时间

以下是您在评论中要求的示例。请记住，这很简单，我不熟悉您使用的waypoint或foundation方法。

    function showPopup() {
        var lastShown = localStorage.getItem('popupLastShown'),
            now = new Date().getTime();

        if(localStorage.getItem('popState') !== 'shown') {
            return true;
        }

        if((now - lastShow) >= 86400000 /* 1 day in milliseconds */) {
            return true;
        }

        return false;
    }

    if(showPopup()){
        var modalwaypoint = $('#learning').waypoint({
            handler: function(direction) {
                if (direction == 'down') {
                    $('#modalwaypoint').foundation('open');
                    localStorage.setItem('popState','shown');
                    localStorage.setItem('popupLastShown', new Date().getTime());
                }

                this.destroy();
            },

            offset: '10%'
        });
    }

显示弹出窗口几次

1 个答案: