javascript - .val 在选择时具有无效值

Question

我有一个<select>, 按钮点击用户可以选择下一个选项：

$(".someButton").on('click', function () {
   var $opt = $("select :selected");

   $("select").val($opt.next().val());
});

问题是在最后一个选项上，$opt.next().val()返回一些不可选择的值，显然 jQuery 默认选择第一个选项。我想要的是它留在最后一个选项。

有没有办法做到这一点（最好不检查 的位置$opt或长度$opt.next()）？

Answer 1

这是一种更有效的方法：

$(".someButton").on('click', function () {
   var el = $("select")[0];
   el.selectedIndex = Math.min(el.selectedIndex + 1, el.length - 1);
});

---

如果您想坚持使用 jQuery，请将 设置option为选中：

$opt.next().prop('selected', true);

如果$opt是最后一个，.next()将返回一个空集，所以什么都不会改变。

Answer 2

老实说，我只会处理这个案子。添加以下内容很简单：

if(!$opt.is(':last-child')) {
    $("select").val($opt.next().val());
}