如何在window.onscroll事件中只調用一次javascript函數？

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;

在上面的代碼中，我想在具有bucket_left類div S設定並從無限滾動生成此div s到新追加div。上面的代碼工作正常，但滾動它附加很多div s。那麼我如何追加一次？如何在window.onscroll事件中只調用一次javascript函數？

來源

2013-02-20 Pooja Desai

考慮定義一個全局布爾變量，該變量初始設置爲「false」，並且第一次滾動發生時設置爲「true」。僅當變量爲'false'時調用該函數。 – 2013-02-20 09:13:51

在你的函數的末尾添加以下行：

function getH4() { 
    // ... 

    window.onscroll = null; 
}

來源

2013-02-20 09:13:59 VisioN

它的工作原理，但只適用於第一次'onscroll'發生時產生的第一套div。在第二個'onscroll'之後，它沒有附加'div'。 – 2013-02-20 09:30:13

@PoojaDesai是的，但這正是你想要實現的：'...代碼工作正常，但在滾動它附加很多div。所以我如何追加一次？'。 – VisioN 2013-02-20 09:31:53

@PoojaDesai：那是我想的要求。你不想在下一次滾動時添加更多的div！ – 2013-02-20 09:32:48

創建一個全局布爾變量，並將其設置爲false。在窗口滾動事件中再次將其設置爲true，並使用if塊將chk變量設置爲false。把你的代碼放在那個塊裏面。

var isScrolled = false; 

function getH4() { 
    if(!isScrolled){ 
     //your code 
    } 
    isScrolled = true 
}

來源

2013-02-20 09:17:13 Ryxle

它的工作，但只適用於第1''onscroll'發生時產生的第一套div。在第二個'onscroll'之後，它沒有附加'div'。 – 2013-02-20 09:31:25

第二次'onscroll'你是什麼意思 – Ryxle 2013-02-20 09:40:09

當你第一次滾動'onscroll'事件中的代碼時，會發生什麼事情會執行。當您嘗試再次滾動時，該條件變爲true並且代碼不會在if條件內執行。 – Ryxle 2013-02-20 09:44:32

你只需要在onscroll屬性沒有設置爲在你結束後的JavaScript函數：

window.onscroll = null;

現在，當腳本執行的第一次，它會執行其功能和上面的行會將onscroll設置爲null，因此不會調用鼠標滾動中的任何事件，因此除了第一次以外，您的函數將不會再次在該事件上被調用。

或者您可以通過設置公開變量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-20 09:31:46

最初它在具有'bucket_left'類的相同'div'中添加了如此多的div。我想要的只是在'bucket_left'類中特定的'div'中添加一個'div'。但函數'getH4（）'應該調用下一個'onscroll'事件，以便它爲後續或下一個具有無限滾動生成的類'bucket_left'的'div'集合附加'div'。 – 2013-02-20 10:03:35

@PoojaDesai：這裏是我得到的笏，你需要在滾動中添加完全「一個」div（滾動可能包含滾動不止一次）..我是否正確？ – 2013-02-22 10:41:08

你可以試試這個：滾動時，檢查等於假，並追加事件只會發生一次; 當滾動結束（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-19 08:34:28 xlhuang

如何在window.onscroll事件中只調用一次javascript函數？

回答

相關問題