觸發一個全局事件點擊並拖動滾動條的任何滾動容器

讓我來解釋清楚的問題，我有很多容器（被動態添加），我有自定義下拉菜單。容器設置爲overflow: auto。觸發一個全局事件點擊並拖動滾動條的任何滾動容器

因此，自定義下拉建議隱藏在該滾動容器中。爲了解決這個問題，我使用position: fixed來定製下拉菜單。

現在，我能夠看到這些建議，我正在使用jquery將這些建議縫合到它們各自的下拉菜單中。但是現在，當我滾動特定容器時，自定義下拉列表建議正在從該下拉列表中移除。

所以，當然我需要在這些容器的卷軸上再次調用這些針跡函數。那麼，我現在正在使用Window元素上的mousewheel和DOMMouseScroll事件來處理這些事件，每次我滾動一個容器時都會觸發它。

但現在當我點擊滾動條來移動它時，事件不會被觸發。因此，我需要一個事件，當我點擊任何容器滾動條來拖動它時觸發。

window.addEventListener('DOMMouseScroll', function() { 
    console.log("hello"); 
}); 
window.addEventListener('mousewheel', function() { 
    console.log("hello"); 
});

DEMO

PS：我不想具體註冊事件到每個容器。我想在全球範圍內觸發這些事件。（，正如我在上面的代碼中所做的那樣，將它們註冊到窗口元素）。

來源

2015-06-03 Mr_Green

您需要在事件偵聽器上添加捕獲標記以使其在「子」元素上工作。默認情況下，這個標誌是false（文檔瀏覽：https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener）

如果爲真，將useCapture指示用戶希望啓動捕獲。在啓動捕獲之後，指定類型的所有事件將被分派到註冊的偵聽器，然後被分派到DOM樹下的任何EventTarget。在樹中冒泡的事件不會觸發指定使用捕獲的偵聽器。有關詳細說明，請參閱DOM級別3事件和JavaScript事件順序。如果未指定，則useCapture默認爲false。

window.addEventListener('scroll', function() { 
    console.log("hello"); 
}, true); // <-- the last argument is the capture argument.

這裏是你的演示改變： http://jsfiddle.net/rlemon/dq5h4kor/8/

來源

2015-06-03 14:50:56 rlemon

-1

你有沒有考慮過使用jQuery'scroll'事件？

如果你

$('.parent').scroll(function() { 
    //yourcode 
});

觸發每個div元素上：

$('*').scroll(function() { 
     //yourcode 
    });

以上會在您每次滾動的每一個元素中時觸發的滾動事件。

它將在鼠標滾輪和拖動滾動條時同時觸發。 JS fiddle

來源

2015-06-03 13:48:04

我不是在尋找觸發特定的容器。正如我在我的文章中所展示的，當我在我的網站上拖動**任何**容器的滾動條時，我希望事件觸發。 –

這觸發了父類中每個元素的滾動事件。因此，您可以將選擇器更改爲覆蓋每個事件的選擇器。我在上面的代碼中添加了另一個示例。 –

我試過你的代碼，因爲容器是動態添加的，所以這不起作用。我甚至嘗試過'$（document）.on（'scroll'，'*''這不起作用。 –

觸發一個全局事件點擊並拖動滾動條的任何滾動容器

回答

相關問題