Javascript 选择optgroup中的一个选项时，如何禁用未选择的选项

我有一个表单组，它有3个选择表单：商户、订单状态和订单支付状态。关注商户选择。我有这样的选择

<select id="merchant_uuid" name="merchant_uuid" class="form-control" data-plugin-selectTwo>
    <option value="">All</option>
    <optgroup label="Brands">
    <?php
        if (isset($merchants)) {
           foreach ($merchants as $merchant) {
                echo '<option value='.$merchant['merchant_uuid'].'>'.$merchant['merchant_name'].'</option>';
           }
        }
    ?>
    </optgroup>
</select>

---

上面的示例代码仍然错误，当我单击All时，所有表单组中的所有选项optgroup都被禁用。任何人都可以帮助我。

在您的JavaScript代码中发现以下错误

与元素ID一起使用的选择器应从开始

对于fetch，如果select元素有一个合适的DOM位置，那么选项是track ie children或chain selector

请检查以下内容，以便为您完成此工作

$('#merchant_uuid').on('change', function() {

    if (this.value == '') {
        $('#merchant_uuid optgroup option').prop('disabled', true);
        $('#merchant_uuid optgroup option:selected').prop('disabled', false);
    } else {
        $('#merchant_uuid optgroup option').prop('disabled', false);
    }
});

注意：如果不想启用当前选定的选项，则 您可以删除if语句的第二行

---

你的期望是错误的。optgroup选择器引用optgroup中的所有选项元素，optgroup正是被禁用的组。除此之外，您还说您的All选项与optgroup有关，但在代码中，option元素不在optgroup中。

$('#merchant_uuid').on('change', function() {

    if (this.value == '') {
        $('#merchant_uuid optgroup option').prop('disabled', true);
        $('#merchant_uuid optgroup option:selected').prop('disabled', false);
    } else {
        $('#merchant_uuid optgroup option').prop('disabled', false);
    }
});