使用 js 選擇下拉菜單的下一個選項的下一步按鈕

Question

<select id="form">
    <option value="1" >1 </option>
    <option value="2" >2 </option>
    <option value="3" >3 </option>
</select>
<button id='next'>Next</button>
<script>
    var select2 = document.getElementById("form");
    var lastselected2 = localStorage.getItem('select2');
    document.getElementById('next')
            .addEventListener('click', function(){
                  lastselected2 = parseInt(lastselected2) + 1;
            });

    if(lastselected2) {
        select2.value = lastselected2; 
    }

    select2.onchange = function () {
        lastselected2 = select2.options[select2.selectedIndex].value;
        console.log(lastselected2);
        localStorage.setItem('select2', lastselected2);
    }
</script>

我有這段代碼可以保存下拉列表中的選定內容，我想添加一個可以選擇下拉列表下一個選項的按鈕。

Answer 1

<script>
function selectNext(){
  var select = document.getElementById('form');
  select.selectedIndex++;
}
</script>

<button id='next' onclick="selectNext()">Next</button>

這是查找所選實際索引並按索引直接轉到下一個索引的好選擇。

https://developer.mozilla.org/en-US/docs/Web/API/HTMLSelectElement/selectedIndex

Answer 2

嘗試這個？

var button = document.getElementById('next');
button.onclick = function() {
   select2.value = parseInt(lastselected2)+1;
}

我知道又快又臟...