2011-08-19 63 views
1

我已經閱讀了有關檢測選擇菜單狀態的問題,無論是visibleopen還是closed,並且快速回答是它不是通用的,取決於您嘗試的操作去做。任何這些答案都不包括我的情況100%。在第一次點擊時檢測onBlur上的select元素的單擊。 (默認爲第二次點擊)

我需要確定什麼時候關閉選擇菜單,當前工作通過存儲變量onblur;然而,select元素不會在第一次關閉時失去焦點,而是第二次關閉。是否有一個事件可以檢測到第一次點擊時發生的事件?或者讓選擇失去焦點而不是第二次點擊關閉?尋找純粹的JavaScript答案,沒有jQuery。

下面是一些示例代碼演示此:http://jsfiddle.net/BhnH9/1/

+0

你試過'onchange'?對於其他元素,它只會在模糊情況下觸發,但我有一個模糊的想法,'」下拉列表打開或關閉的情況。但請注意,您所說的單擊不會涵蓋所有的基礎:如果在列表打開時按下Tab鍵關閉它並移動到下一個元素。此外,使用鍵盤,你可以選擇不同的選項,甚至沒有下拉列表... – nnnnnn

+0

@nnnnnn這就是爲什麼我檢測onblur,因爲無論使用鼠標或鍵盤改變焦點區域,我都可以捕獲它們。問題是當你用鼠標點擊選擇到頁面的空白區域時,焦點仍然在選擇(即使下拉關閉),它只是在第二次點擊選擇正式模糊 –

+0

在IE當你使用鼠標選擇一個新選項時,onchange會被觸發,即使元素仍然有焦點(但是如果你點擊已經選擇的選項,它不會被觸發,並且除非焦點沒有被鍵盤改變觸發在改變)。 – nnnnnn

回答

0

最近有人對此主題發表評論,所以我決定再看看這個問題。我不記得原來的情況如何,但我知道我需要選擇下拉菜單,以在選定項目後失去焦點。所以,瞧,我的jQuery解決方案......我說什麼,它不得是jQuery :)這是很長一段時間,我換了工作,並不知道爲什麼這是一個要求。

$('select').bind('change', function(e) { 
    $(this).trigger('blur'); 
}); 

$('select').bind('blur', function(e) { 
    alert('select lost focus'); 
}); 

這裏有一個的jsfiddle:http://jsfiddle.net/7tUse/

0

您可以使用文檔(或選擇一些其他合適的祖先),一般的點擊監聽器,看看選擇元素相匹配的document.activeElement。如果是這樣,那麼它的重點或者是因爲它剛剛獲得它或者選擇了一個選項。

但是,還有其他方法可以選擇比點擊更多的選項,例如鍵盤導航。點擊監聽器不會幫助你。

+0

那麼,如果我強迫選擇失去對文檔上的點擊事件的關注,那會不會幫助我並覆蓋我的基地? –

+0

我實現了你所說的同樣的問題。 http://jsfiddle.net/BhnH9/2/如果您點擊或以某種方式導致焦點落在下拉菜單上,那麼請單擊一個空白區域,直到您再次單擊該選項的「模糊」並記錄正文的「點擊」。 –

+0

通常,您無法知道某個選擇列表何時打開,只是因爲選擇和重新選擇選項以及導航可用的所有不同方法而僅跟蹤點擊次數不足。你可以說的是,onblur,這個名單是封閉的。 – RobG

相關問題