jquery - 选择输入顺序

Question

所以我有 3 个选择输入字段，我想知道是否可以在选择其他选项后禁用它们。IE：

<tr id="row1">
    <th>Row 1</th>
    <td>
        <select>
            <option value="1">1</option>
            <option value="2" selected>2 selected so 1+3 are disabled</option>
            <option value="3">3</option>
        </select>
    </td>
</tr>

<tr id="row2">
    <th>Row 2</th>
    <td>
        <select>
            <option value="1" selected>1 selected 2+3 are disabled</option>
            <option value="2">2</option>
            <option value="3">3</option>
        </select>
    </td>
</tr>

<tr id="row3">
    <th>Row 3</th>
    <td>
        <select>
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="3" selected>3 (you get it...)</option>
        </select>
    </td>
</tr>

Answer 1

尝试这个：

$('select').change(function(){
    $(this).find('option:not(:selected)').prop('disabled', true)
})

演示

Answer 2

您可以将 onchange 事件绑定到选择。然后选择哪些选项元素没有被选中并禁用它。如果你已经熟悉 jQuery，你可以这样做：

$("select").bind("change", function(){
        $(this).children("option:not(:selected)").attr("disabled", "disabled");
    });

Answer 3

禁用其他选项将阻止用户更改他们的选择，因此只需使用 javascript 删除所有其他选项。

快速，肮脏的方式是

<select onchange='for(vari=0, l=this.options.length; i<l; i++){ if(this.options[i].selected) continue; this.remove(i); }'>

不需要 Jquery。但是，我不建议将 javascript 与 html 混合，除非您没有任何其他外部 javascript 可以导入并将其用作这些特定选择语句的处理程序。