如何從下拉菜單中選擇選項？

Question

我在html中有一個下拉列表

<select id="dropdown">
    <option value="text">Text</option>
    <option value="graphic">Graphic</option>
    <option value="formula">Formula</option>
    <option value="title">Title</option>
</select>  

我試圖通過調用函數從菜單中獲取選定的選項。 我嘗試了兩種選擇：
1.我嘗試使用onclick-問題是，當我單擊下拉按鈕但未選擇任何選項時，我的函數調用被觸發。
2.所以我使用onchange來調用我的函數，但是當我使用它時，如果我想連續使用相同的選項，則不會觸發該函數調用，因為顧名思義，僅當該選項為改變了。
我還有其他方法可以獲取所選選項嗎？

這是我的劇本-

...  
document.addEventListener('DOMContentLoaded',function() {   document.querySelector('select[name="zonelist"]').onclick=getSelectedTextValue;
},false);  
...  
function getSelectedTextValue(){}  
...

Answer 1

向其添加一個標志，並使用click事件。

如果在<select>外部單擊，則可能不起作用，但是可以對這種情況進行處理。

 var open = false; document.getElementById('dropdown').addEventListener('click', function(e){ open = !open; if(!open){ console.log(this.options[this.selectedIndex].text) } }); //check if click outside window.addEventListener('click', function(e){ if (!document.getElementById('dropdown').contains(e.target)){ open = false; } }); 

 <select id="dropdown"> <option value="text">Text</option> <option value="graphic">Graphic</option> <option value="formula">Formula</option> <option value="title">Title</option> </select>