Кэширование браузера выбирает состояние тега и игнорирует selected = "true"

Question

Я рендеринг выпадающего списка, который содержит текущее выбранное значение, используя selected="true".

<select id="dropDown"> 
    <option selected="true" value="1">value2</option>
    <option value="2">value3</option>
    <option value="3">value4</option>
</select>

Первоначально выбранное значение соответствует selected="true", но если я поиграюсь с каплейвниз, а затем обновите страницу, selected="true" игнорируется, и отображаемое значение является последним, которое я выбрал.Я попытался использовать selected="selected" с теми же результатами.Спасибо за вашу помощь.

Answer 1

Измените поле выбора на <select id="dropDown" autocomplete="off">

Answer 2

Для лучшей поддержки браузеров на самом деле (хотя это кажется глупым) лучше использовать

autocomplete="nope"

Цитировать MDN:

В некоторых случаях браузер будет предлагать значения для автозаполнения даже если атрибут автозаполнения отключен. Это неожиданно поведение может быть довольно загадочным для разработчиков. Трюк на самом деле принудительное отсутствие автозаполнения заключается в назначении случайной строки приписывать ...

... Так как это случайное значение не является допустимым, браузер выдаст до.

https://developer.mozilla.org/en-US/docs/Web/Security/Securing_your_site/Turning_off_form_autocompletion

Answer 3

Это двоичное значение, а не атрибут (по какой-то причине). Использование:

<option selected="selected" value="1">value2</option>

или

<option selected value="1">value2</option>