Question

将新选项添加到下拉菜单中的最佳方法是什么，并将其设置为不可选择且列表中的第一个？

所以列表应如下所示：

<select onchange="document.getElementById('product_configure_form').action = 'http://webshop.com/product/options/3603848/'; document.getElementById('product_configure_form').submit();" id="product_configure_option_22853" name="option[22853]">

  <option selected="selected" value="78619">Choose a size</option> // this is the new not selectable option
  <option selected="selected" value="78619">S</option>
  <option value="78620">M</option>
  <option value="78621">L</option>
</select>

我知道如何添加选项：

$('#product_configure_option_22853').append('<option value="Choose" selected="selected">{{ 'select your size' | t }}</option>');

但是如何让它不可选择并且是列表中的第一个？

任何帮助都非常感谢！

Answer 1

使用.prepend（）

$('#product_configure_option_22853').prepend('<option value="Choose" disabled="disabled">{{ 'select your size' | t }}</option>');

Answer 2

你不能同时拥有两者。

如果您禁用某个选项，则会跳过该选项以支持可选择的选项，即使它是列表中的第一个选项：

<select>
    <option disabled>One</option>
    <option>Two</option>
    <option>Three</option>
</select>

在此示例中，选项2将显示为默认选项。如果禁用，则无法选择选项。

如果您确实需要这种行为，则需要验证未选择该选项，而不是依赖于HTML属性。

不可选择的选项值

2 个答案: