Javascript - 無法使用事件偵聽器更改 Select 的值

Question

出於某種原因，我可以毫無問題地使用 javascript 在下拉列表中設置 select 選項，但是當我使用事件偵聽器執行相同的代碼時，該選項不會改變。

html：

<select id="sel">
    <option value="car">1</option>
    <option value="bike">2</option>
    <option value="cycle">3</option>
</select>
<button id = "button"  type = "button" class = "">Test</button> 

Javascript：

const button = document.getElementById('button')
button.addEventListener('click', e=>{
    console.log('executed')
    document.getElementById('sel').value = 'bike'
})

即使執行已發布到控制台，也不會更改值。 但是，以下工作並將選項更改為 2

document.getElementById('sel').value = 'bike'

那么 document.getElementById('sel').value = 'bike' 在事件偵聽器外部執行但在事件偵聽器內部不起作用時如何工作？

Answer 1

所有，感謝所有評論的人，你是正確的，代碼在原版 javascript 中運行良好。 我使用 materialcss 作為我的樣式主題，無論出於何種原因，當應用 materialcss 時，事件偵聽器不起作用。 當不再應用 materialcss 時，情況並非如此。 我很快就會發布這個。