3 
function getH4() {
    var xyz = document.getElementsByClassName('bucket_left');
    for(var i=0;i<xyz.length;i++){
        var x=document.getElementsByTagName("h4")[i].innerHTML;
        var current_bucket = xyz[i];
        var y=current_bucket.firstChild.href;
        var newdiv = document.createElement('div');
        newdiv.innerHTML = "<a href=\""+y+"\">"+x+"</a>";
        newdiv.className = "hover_title_h4";
        current_bucket.appendChild(newdiv);
    }
}

window.onscroll=getH4;

在上面的代码中，我想div在一组div具有类的 s 中附加新的，bucket_left而 thisdiv是从无限滚动生成的。上面的代码工作正常，但在滚动时它附加了很多divs。那么我如何只追加一次？

4

4 回答 4

6

在函数末尾添加以下行：

function getH4() {
    // ...

    window.onscroll = null;
}
于 2013-02-20T09:13:59.167 回答
1

您只需onscroll在 JavaScript 函数的末尾将属性设置为 none，如下所示：

window.onscroll = null;

现在，当脚本第一次执行时，它将执行其功能，上面的行将设置onscroll为 null，因此不会在鼠标滚动时调用任何事件，因此您的函数不会在事件上一次又一次地被调用，除了首次。

或者，您可以通过设置一个公共变量 say 来在逻辑上处理它var check = 0，然后在第一次输入时将变量设置为 1。因此，您需要检查check并基于该值执行该功能

var check = 1;
function getH4() {
    if(check==1)
    {
    var xyz = document.getElementsByClassName('bucket_left');
    for(var i=0;i<xyz.length;i++){
        var x=document.getElementsByTagName("h4")[i].innerHTML;
        var current_bucket = xyz[i];
        var y=current_bucket.firstChild.href;
        var newdiv = document.createElement('div');
        newdiv.innerHTML = "<a href=\""+y+"\">"+x+"</a>";
        newdiv.className = "hover_title_h4";
        current_bucket.appendChild(newdiv);
     }
        check=0;
    }
}
于 2013-02-20T09:31:46.550 回答
1

创建一个全局布尔变量并将其设置为 false。再次在窗口滚动事件中将其设置为 true，并使用 if 块检查变量是否为 false。将您的代码放入该 if 块中。

var isScrolled = false;

function getH4() {
    if(!isScrolled){
        //your code
    }
    isScrolled = true
}
于 2013-02-20T09:17:13.790 回答
0

你可以试试这个：滚动时，检查等于假，追加事件只会发生一次；当滚动结束（mouseup 或 mouseout）时，检查等于 true，您可以再次追加。

var check = true;
function getH4(event) {
    event.target.onmouseup = function() {
        check = true;
    }
    event.target.onmouseout = function() {
        check = true;
    }
    if (check) {
        var xyz = document.getElementsByClassName('bucket_left');
        for(var i=0;i<xyz.length;i++){
            var x=document.getElementsByTagName("h4")[i].innerHTML;
            var current_bucket = xyz[i];
            var y=current_bucket.firstChild.href;
            var newdiv = document.createElement('div');
            newdiv.innerHTML = "<a href=\""+y+"\">"+x+"</a>";
            newdiv.className = "hover_title_h4";
            current_bucket.appendChild(newdiv);
        }
    check = false;
}

window.onscroll=getH4
于 2013-09-19T08:34:28.467 回答