Disabled but ALSO checked

Question

How can you make the first option ("Choose one of the three below") disabled but also selected at the same time? So that when you go to the page, before you click on the selector the field "Choose one of the three below" is displayed, but as soon as you select a new field you can not select the field again because it is disabled. I tried the Boolean attributes disabled and checked, but that didn't work.

<select>
    <option value="">Choose one of the three below</option>
    <option value="1">Option 1</option>
    <option value="2">Option 2</option>
    <option value="3">Option 3</option>
</select>

*disabled but also selected* `disabled selected`? – connexo Sep 24 '20 at 21:54 — connexo, Sep 24 '20 at 21:54

score 1 · Accepted Answer · answered Sep 24 '20 at 21:40

Use both the selected and disabled attributes, on the <option>:

<select>
    <option selected disabled>Choose one of the three below</option>
    <option value="1">Option 1</option>
    <option value="2">Option 2</option>
    <option value="3">Option 3</option>
</select>

Disabled but ALSO checked

1 Answers1