Javascript 如何在下拉选择中禁用某些选项?

Javascript 如何在下拉选择中禁用某些选项?,javascript,jquery,html,select,drop-down-menu,Javascript,Jquery,Html,Select,Drop Down Menu,我们有两个不同的下拉框,根据第一个下拉框中选择的下拉框,第二个下拉框中的选项将灰显 HTML 收听第一个选择元素的更改事件,然后如果所选选项的值为2,则有条件地禁用其值为5的选项: 根据您的完整HTML,您可能实际上不需要jQuery: 你的小提琴起作用了。你到底在问什么?@robaby不,不是。看起来OP希望只有在第一个菜单中选择了值为2的选项时,才禁用值为5的选项元素。我必须将脚本放在哪里?在头上?还是没关系? <select> <option value=

我们有两个不同的下拉框,根据第一个下拉框中选择的下拉框,第二个下拉框中的选项将灰显

HTML


收听第一个
选择
元素的
更改
事件,然后如果所选
选项的值为2,则有条件地禁用其值为5的
选项


根据您的完整HTML,您可能实际上不需要jQuery:


你的小提琴起作用了。你到底在问什么?@robaby不,不是。看起来OP希望只有在第一个菜单中选择了值为2的选项时,才禁用值为5的
选项
元素。我必须将脚本放在哪里?在头上?还是没关系?
<select>
    <option value="1">Option 1</option>
    <option value="2">Option 2</option>
    <option value="3">Option 3</option>
</select>

<select>
    <option value="4">Option 4</option>
    <option value="5">Option 5</option>
    <option value="6">Option 6</option>
</select>
if ($('option[value=2]').prop('selected', true)) {
  $('option[value=5]').prop('disabled', true);
}
$('select:first').on('change', function () {
    $('option[value=5]').prop('disabled', this.value === '2');
});
document.querySelector('.first-menu').addEventListener('change', function () {
    document.querySelector('option[value="5"]').disabled = this.value === '2';
});