滚动时运行脚本，但只能运行一次

Run script upon scroll, but only once

本文关键字：运行 一次 脚本 滚动      更新时间：2023-09-26

我在我的网站上使用IntroJS。人们可以通过单击我的按钮开始游览，但我希望它在访问者向下滚动时自动开始。我为此制作了这个功能，但它不断开始游览，从而翻转整个网页：

window.onscroll = function() {tourstart()};
function tourstart() {
    if (document.body.scrollTop > 50) {
        introJs().start();
}
}

如何使其只运行一次？

提前谢谢你！

在开始游览时删除处理程序：

function tourstart() {
    if (document.body.scrollTop > 50) {
        window.onscroll = null;
        introJs().start();
    }
}

你写了标签 jQuery，所以如果你使用它，你可以只写：

$(window).one('scroll', function() {
  tourstart();
});
如果你想

在页面加载后运行一次，试试这个：

var onlyOnce = true;
window.onscroll = function() {tourstart()};
function tourstart() {
    if (document.body.scrollTop > 50 && onlyOnce) {
        onlyOnce = false;
        introJs().start();
    }
}

但是如果你想为user（/browser）运行一次，你可以使用cookie，这里有另一个堆栈溢出解决方案来使用cookie，但在这里复制/粘贴函数：

代码更改方式如下：

var onlyOnce = readCookie("once");
window.onscroll = function() {tourstart()};
function tourstart() {
    if (document.body.scrollTop > 50 && onlyOnce!="true") {
        createCookie("once", "true", 10); // It expires in 10 days for example
        introJs().start();
    }
}
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;
}
相关文章：