У меня странная (в основном) графическая проблема (не следует изменять базовые результаты) с тегами Firefox и <select>
, содержащими <option>
s, которые имеют одинаковые значения при мягком обновлении.
Вот образец, который лишен большей части <option>
с (и один изменен на ошибочное значение для демонстрации эффекта):
<html>
<body>
<form>
<select class="form-control" id="temporal[startzone][]" name="temporal[startzone][]" required="">
<option value="-12:00" selected="selected">UTC-12:00</option>
<option value="-12:00">--International Date Line West</option>
<option value="-11:00">UTC-11:00</option>
<option value="-11:00">--Coordinated Universal Time-11</option>
<option value="-10:00">UTC-10:00</option>
<option value="-10:00">--Hawaii</option>
<option value="-09:00">UTC-09:00</option>
<option value="-09:00">--Alaska</option>
<option value="-08:00">UTC-08:00</option>
<option value="-08:00">--Baja California</option>
<option value="-08:00">--Pacific Time (US & Canada) - Standard</option>
<option value="-07:00">UTC-07:00</option>
<option value="-12:00">--Pacific Time (US & Canada) - Daylight Savings</option>
<option value="-07:00">--Arizona</option>
</select>
</form>
</body>
</html>
Ожидаемое поведение:
Если пользователь НЕ взаимодействовал с полем, сохраните исходный выбор между мягкими обновлениями.
Если пользователь взаимодействовал с полем, сохраните свой последний выбор между мягкими обновлениями.
При жестком обновлении по умолчанию выбрано поле.
Наблюдаемое поведение:
В Edge и Chrome (и предположительно в других браузерах на основе Chromium): то же, что и ожидаемое поведение.
In Firefox:
При жестком обновлении по умолчанию выбрано поле. (то же, что и ожидалось)
При мягком обновлении: изменяет выбранный <option>
, чтобы он стал последним в списке с тем же value
.
То есть, если пользователь НЕ взаимодействует с <select>
, он в настоящее время изменит отображаемое <option>
на --Pacific Time (US & Canada) - Daylight Saving
.
Если пользователь взаимодействовал с ним, он выберет последний <option>
, который имеет те же value
, что и value
из <option>
выбранного пользователем.
Другие комментарии:
Это на самом деле не вопрос о том, соблюдается ли selected
между мягкими обновлениями, поэтому autocomplete="off"
не решает эту проблему (потому что отбрасывает вводимые пользователем данные при мягких перезагрузках ).
На это не влияет Javascript - проблема возникает с показанным примером кода и без дополнительных дополнений.
Такое чувство, что мне нужно "противоположное" тегу <optgroup>
? Где у группы есть значение, а у ее параметров нет? Но я не видел ни одного примера или обсуждения такого тега (хотя вполне возможно, что я что-то пропустил)
Также возможно, что для этого есть лучшая структура данных. Открыты для предложений!