<select> <option disabled> 使选项项在 firefox 中消失

Question

<select class="form-control" id="service_select">    
     <option disabled="disabled"></option>
</select>

在 chrome 中它很好。是否有另一种方法可以使其禁用但不隐藏？谢谢。

Answer 1

该选项没有隐藏 - 您只是其中没有任何文本：

<select class="form-control" id="service_select">    
     <option disabled="disabled">Place some text here</option>
</select>

如果您的第一个选项被禁用（因此无法选择），Firefox 将选择第一个未禁用的选项。

<select class="form-control" id="service_select">    
     <option disabled="disabled">One</option>
     <option disabled="disabled">Two</option>
     <option>Three</option>
</select>

当您检查下拉列表时可以看到前两个选项，但无法选择 - 因此在上面的示例中将选择“三个”。

如果您想阻止用户选择第一个选项，但又想显示它 - 使用带有空值的 required 属性...

    <select required>
        <option value="">Please select</option>
        <option value="1">One</option>
        <option value="2">Two</option>
    </select>