javascript - 下一个按钮用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