Question

我正在尝试使用包含工作经验的静态框创建在线简历。这个想法是，当您上下滚动不同的公司时，它们相关的信息就会淡入淡出。到目前为止，这是我的JavaScript代码：

var employment_history_display = "Microsoft";
document.getElementById("employment_history_text").onwheel = function () {
    if (event.deltaY < 0) {
        if (employment_history_display == "SoftwareAG") {
            $("#SoftwareAG").animate({ opacity: '0' });
            $("#Microsoft").animate({ opacity: '1' });
            employment_history_display = "Microsoft";
        } else if (employment_history_display == "NAS") {
            $("#NAS").animate({ opacity: '0' });
            $("#SoftwareAG").animate({ opacity: '1' });
            employment_history_display = "SoftwareAG";
        };
    } else if (event.deltaY > 0) {
        if (employment_history_display == "SoftwareAG") {
            $("#SoftwareAG").animate({ opacity: '0' });
            $("#NAS").animate({ opacity: '1' });
            employment_history_display = "NAS";
        } else if (employment_history_display == "Microsoft") {
            $("#Microsoft").animate({ opacity: '0' });
            $("#SoftwareAG").animate({ opacity: '1' });
            employment_history_display = "SoftwareAG";
        };
    };
};

页面加载时，“ Microsoft” div可见，其他两个透明。它在车轮上工作，下一个div淡入，最后一个div淡出。但是，它会快速滚动浏览两者，而不会停在中间。我相信这是由于车轮返回多个值，因此该函数重复了多次。无论如何，要使onwheel下定义的功能只能运行一次？

Answer 1

使处理程序在满足任意条件后停止运行的一种通用方法是，在满足条件后将事件处理程序从其自身中删除-例如，在第一次执行函数结束时，如果您希望它只执行一次，请执行以下操作：document.getElementById("employment_history_text").onwheel = function () {}

JavaScript的onscroll（）函数遇到问题

1 个答案: