jQuery如何选择第一个非隐藏的选择选项

Question

以下jQuery 1.9和1.10+之间的行为有所不同:

<select id="s1">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
</select>

$('#s1 option[value=1]').hide();
$('#s1').val('');

此代码背后的想法是在隐藏一些选项(包括当前选定的选项)后选择第一个非隐藏选项.

由于jQuery 1.10+ $('#s1').val('');不再选择第一个非隐藏选项,而且.val(<some proper value for the particular select box>)工作正常.

尝试以下方法不帮助,因为双方selectedIndex并.first().val()考虑隐藏的选项:

$("#s1").prop("selectedIndex", 0);

$('#s1 option').first().prop('selected', true);

我想到的下一件事(也由C-link建议)也不起作用,因为:visible选择器对选择选项不起作用.

$('#s1 option:visible').first().prop('selected', true);

寻找一些通用的方法(不依赖于知道什么是特定值以及隐藏了哪些选项)来实现与$('#s1').val('');旧jQuery 相同的行为.

Answer 1

很像这样:

$('#s1').find("option:not(:hidden):eq(0)");

Answer 2

从其他人的答案/评论编译如下:

$('#s1 option').each(function () {
    if ($(this).css('display') != 'none') {
        $(this).prop("selected", true);
        return false;
    }
});