Javascript檢測下拉列表關閉時

由於在這個question中解釋的問題，我有一種情況，我需要將mousewheel事件附加到下拉列表中，只有當它展開（我在onclick事件中這樣做）。不過，當列表崩潰時，我需要刪除mousewheel事件。我如何去檢測這個？Javascript檢測下拉列表關閉時

我不能只使用onchange事件，因爲用戶可能沒有真正改變他們的選擇。我已經嘗試了onblur事件，但在大多數瀏覽器（IE除外）下拉列表保持聚焦，當列表被摺疊。

乾杯。

var list = document.getElementById("list"); 
list.onclick = function (e) { 
    // attach mousewheel 
    list.onmousewheel = function (e) { 
     // ... 
    } 
    // attach click off 
    // This event fires fine in all browsers except FF when the list is expanded. 
    // In firefox it only fires when anywhere in the document is clicked twice. 
    // The first click closes the drop down list as expected and the second one 
    // fires the event. 
    window.document.onclick = function (e) { 
     list.onmousewheel = null; 
     window.document.onclick = null 
    } 
};

編輯： 不幸的是，在Firefox MEDER的解決方案不起作用。文檔上的點擊事件不會被觸發，直到我點擊兩次下拉列表。我該如何解決這個問題？它在IE中正常工作。

EDIT2： 我做了一些更多的測試與以下瀏覽器像預期的那樣

IE 7，
三價鉻
歌劇院10

Firefox的要求在窗口中單擊2次以使其工作& Safari根本不起作用。

看來，即使您點擊下拉列表中的Firefox，仍然關注它。直到第二次點擊發生，下拉列表才最終失去焦點。

來源

2009-09-21 Alex

你有鏈接或代碼？ – 2009-09-21 03:46:45

你在找這樣的嗎？如果用戶點擊不在#el內的任何地方，它將分支出來，你可以做你想做的事情，雖然這需要jQuery，但是需要太多的DOM腳本。

var dropdown = $('#el'); 
$(document).click(function(e){ 
    if ((!$(e.target).is(dropdown)) || !$(e.target).closest('#el').length) { 
     // do what you need to 
    } 
});

如果不是，你可以更具體，包括一個例子嗎？

PS - 我沒有測試片段，對不起，如果它不是你想要的。

來源

2009-09-21 02:22:58

不幸的是我不能使用jQuery。此外，單擊事件不會在FF中被觸發，直到我在文檔中單擊兩次。 – Alex 2009-09-21 03:42:38

好的，我仍然不知道你想用這樣一個嚴格腳本的選擇框來達到什麼目的，但是通常試圖改變本地內部工作<select>並不富有成效。沒有標準說明事件如何在表單元素內部流動，而實現select作爲操作系統級別構件（IE）的瀏覽器無論如何都無法支持它。

如果你必須有這種行爲，我建議使用腳本來替換<select>框與由<div> s製成的JavaScript供電模擬器。然後，您可以精確控制每個鼠標和鍵盤交互行爲的方式。有many libraries這樣做已經這樣做，但如果你需要非常具體的確切行爲，他們可能不適合你。

來源

2009-09-21 10:02:53 bobince

Javascript檢測下拉列表關閉時

回答

相關問題