javascript - 如何使用 javascript、jquery 或其他一些巧妙的方式提交选择中的下一个选项？

Question

我有一个 php 页面，我想将 NEXT SELECTION 功能添加到我的选择中。

这是我的代码:

<form action='' method='GET' id='searchSelect'>
   <select name='search'>
      <option>beer</option>
      <option>chips</option>
      <option selected>BACON</option>
      <option>CHEESE</option>
      <option>poutine</option>
   </select>
   <input type='submit'>
   <button>NEXT SELECTION</button>
</form>    

我觉得我应该能够聚焦所选内容(在本例中为 BACON)并使用带有按钮的 JavaScript 提交它(CHEESE)，但我不确定如何正确实现这一点。任何建议将不胜感激。

a FIDDLE HERE

编辑:为了澄清我的问题:我的选择中有一个很长的列表，在进行选择时重新选择选项栏并选择列表中的下一个选项很痛苦。我希望用户能够单击下一步，它会在当前 SELECTED 选项之后提交列表中的下一个。该页面是 php，当单击它时，它会使用 GET 方法提交到当前页面。加载页面时，它会获取 GET(name=search) 并将其设置为使用页面上的一些 php 选择。

Answer 1

使用 jQuery(简化):

$("select").find("option:selected").next().prop("selected",true);

See fiddle (e.preventDefault() 是为了显示值已更改 - 提交删除该行)

更新

使用 :selected 而不是 [selected] 来获取当前选择的选项，而不是原始选择..

Updated fiddle