<select>列表中的捕獲事件

我想知道如何在用戶單擊「選擇」下拉列表時捕獲下拉列表中的事件。我想舉個例子，當列表的不同元素聚焦時攔截事件。<select>列表中的捕獲事件

我試圖將事件偵聽器綁定到列表的選項元素，但它們不捕獲任何東西。看到這裏的示例代碼：

<select> 
     <option onfocus="alert('Hi there');">Foo</option> 
     <option>Bar</option> 
    </select>

感謝

來源

2013-02-01 Renaud

@ dave283和Kolink謝謝您的回答。我想知道是否可以訪問下拉列表來直接向它註冊事件，就像你在彈出式菜單上一樣。如果您選擇列表中已選中的元素，則不會觸發註冊onChange事件。 – Renaud

嗨，裏諾，我真的不明白你的問題。通過選擇已經選擇的相同元素意味着什麼。您想要觸發警報的操作是什麼？必須採取某種行動來觸發事件。 – dave823

Hi @ dave823，在上面的例子中，具體的用例是：我選擇Foo，然後再次點擊選擇的項目（Foo被選中），然後我再次選擇Foo。 onChange事件不會被觸發，因爲所選值沒有更改。這就是爲什麼我想直接在下拉列表中註冊事件的原因。那有意義嗎？ – Renaud

你不能，<select>是替換元素和它的孩子們只能作爲它的數據，而不是實際的子元素。

您可以做的最好的事情是將onChange事件應用到<select>本身，然後訪問this.options[this.selectedIndex]做東西。

來源

2013-02-01 17:42:49

你必須抓onchange事件，然後進行測試，看看有什麼變到，這樣的事情：

更新：注意我加onfocus事件。

更多的想法，點擊這裏：Is there an onSelect event or equivalent for HTML <select>?

<script type="text/javascript"> 

function myDDLOnChangeEvent() 
{ 
    var selectedValue = document.getElementById('myDDL').value; 
    if(selectedValue == 'Foo') 
    { 
     //alert('Hi there'); 
     //do stuff here - except for alerts 
     //if you put an alert here, it will fire the onfocus event again.. 
     // ..after you click 'ok' in the alert box 
    } 
} 

</script> 

<select id="myDDL" onchange="myDDLOnChangeEvent();" onfocus="this.selectedIndex = -1;"> 
    <option>Foo</option> 
    <option>Bar</option> 
</select>

來源

2013-02-01 18:19:13 dave823

<select>列表中的捕獲事件

回答

相關問題