Question

我有表格组，有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 then选项时，optgroup作为父级被禁用，并在其他选择中保持启用optgroup。

$('merchant_uuid').on('change', function() {
    if (this.value == '') {
        $('optgroup option').prop('disabled', true);
    } else {
        $('optgroup option').prop('disabled', false);
    }
});

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

Answer 1

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

与元素ID一起使用的选择器应从#开始。
对于fetch，如果选择元素，则选项是正确的DOM位置，即children() or 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中的某个选项，如何禁用未选中的选项

1 个答案: