Firefox игнорирует опцию selected = «selected»


112

Если вы измените раскрывающийся список и обновите страницу, Firefox будет игнорировать выбранный атрибут.

<option selected="selected" value="Test">Test</option>

Фактически он выберет вариант, который вы выбрали ранее (до обновления). Это становится проблемой для меня, поскольку в раскрывающемся списке запускается событие, которое меняет другие вещи.

Есть ли способ заставить Firefox остановить это поведение (кроме запуска другого события при загрузке страницы)?


Я столкнулся с этой проблемой сейчас и исправляю ее с помощью$('option:selected').each(function(){ $(this).prop('selected',true); });
plonknimbuzz

Я заметил, что это происходит только с выбранными элементами, у которых отсутствует атрибут имени
Tlacaelel Ramon Luis

4
попробуйте autocomplete = "off"
hemanjosko

Ответы:


5

AFAIK, это поведение жестко запрограммировано в Firefox.

Вы можете попробовать настроить каждый элемент формы defaultValueна загрузку страницы.


1
Можно ли было сделать это для всех элементов в форме?
monkey-wrench

@monkey с использованием jQuery, должно быть что-то вроде $(":input").val(this[0].defaultValue);(непроверено); в обычном JS гуляй хоть каждыйdocument.getElementsByTagname("select")
Пекка

Хотя, возможно, это не идеальное решение, это работает .. вам нужно проверить getAttribute ("selected")
monkey-wrench

8
К вашему сведению - Марко Демайо
дает

283

Добавьте autocomplete="off"атрибут HTML к каждому тегу выбора.

(источник: https://stackoverflow.com/a/8258154/260080 )


7
Это мое предпочтение (большое спасибо Марко и гаечный ключ, спасли там несколько прядей моих волос). И вам также нужно будет добавить его к каждому <input> с атрибутом «value» или «checked» и к любому <textarea> с содержимым.
Swanny

22
Это определенно должен быть правильный ответ. Работает как шарм.
Эндрю Сеннер 02

1
это не действительный w3c
Хосе Де Гувейя

1
У меня была такая же проблема в Windows, Firefox версии 44.0 (январь 2016 г.). И это решение до сих пор работает.
Стивен

1
Работает как шарм на firefox 47.0.
Blackecho

73

В firefox я заметил, что атрибут «selected» не будет работать, если вы не разместите выбор внутри формы, где форма имеет атрибут имени.


3
БАМ! Это исправило это там, где autocomplete = "off" не сделал.
little_birdie

Провел час почесывая голову с Firefox 78.0.2. Мне не нужно было указывать имя в моей анкете, но это принесло облегчение.
betakilo

11

У меня была такая же проблема, поверьте мне, с этим дурацким поведением firefox уже более 10 часов боролся, у меня есть 7 раскрывающихся списков, каждый из которых запускает событие и заполняет 24 скрытых поля ввода, так что вы можете себе представить, что выбран правильный вариант с помощью 24 неправильных входных значения !!! решение, которое я наконец нашел, - сбросить форму с помощью Javascript, добавив эту строку кода:

window.onload = function() { document.forms['MarkerForm'].reset(); };

PS: входные данные имеют значения, извлеченные из базы данных, поэтому сброс формы не очищает никакого значения, но в некотором смысле сообщает firefox вернуться к черту, чтобы выбрать опцию selected = selected!


Это правильный ответ. Ответы, в которых говорится об использовании «автозаполнения» для элемента выбора, неверны, потому что «автозаполнение» НЕ является допустимым атрибутом для поля выбора в соответствии с W3 и вызовет «Автозаполнение атрибута не разрешено при выборе элемента на этом этапе». ошибки при проверке.
Скотт

6

Это просто Firefox запоминает ваш предыдущий выбор при обновлении. Вместо этого попробуйте жесткое обновление.

Также такая же проблема здесь: https://stackoverflow.com/a/1505693/1069232

Также см. Здесь: https://bugzilla.mozilla.org/show_bug.cgi?id=274795


похоже, что это особенность firefox.
Алексей Кислицын

5

Попробуйте отключить autocompleteатрибут ввода выбора ... иногда браузер игнорирует selectиз-за этого


3

Я использую FF 25.0.1

Его игнорируют selected=""и selected="selected".

Но если я просто попробую, selectedвариант будет выбран.

Странное (несоответствующее) поведение. Я знаю, что selectedэто действительный HTML5, и это самая короткая форма, но я обычно пишу код, который также проверяет как хорошо сформированный XML, так что я могу использовать любой инструмент проверки XML для очень строгой проверки моих результатов (а обмен данными очень прост ... .)

Согласно W3C, эти варианты должны быть действительны для логических атрибутов:

HTML5:  boolAttr="" | boolAttr="boolAttr" | boolAttr
XHTML5: boolAttr="" | boolAttr="boolAttr"

Я предпочитаю первый, так как он почти такой же короткий, как последний (не совместимый с xml) вариант, но должен проверяться как XHTML5, так и HTML5. Надеюсь, Mozilla это исправит!


3

используйте .prop () вместо .attr ()

This does not work in firefox.
  $( 'option[value="myVal"]' ).attr( 'selected', 'selected' );
use this one
  $( 'option[value="myVal"]' ).prop( 'selected', 'selected' );

In other way
  $( this ).prop( 'selected', 'selected' );

Использование .prop('selected', true);или .prop('selected', false);(jQuery) для включения / выключения работает как для Firefox, так и для Chrome.
JimB

2

Вы можете вызвать .reset()форму перед обновлением страницы.


2

заключите select в атрибут формы, и он будет работать.

<!-- will not work in firefox -->
<option selected="selected" value="Test">Test</option>

и

<!-- this will work in firefox -->
<form>
 <option selected="selected" value="Test">Test</option>
</form>


2

С именем лучше

form id="UMForm" name="UMForm" class="form"

Выбор примет выбранный атрибут


1

автозаполнение у меня тоже не работало.

Это исправление javscript, написанное на jquery, которое я использую:

$('input[type="radio"][selected]').click();

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

В этом случае это сработало как для Chrome, так и для Firefox.

$('option[value="Test"]').prop('selected', true);

Я использовал .attr()вместо.prop()


1

Чтобы отобразить первый элемент раскрывающегося списка, используйте ProjectName.ClearSelection();

Поместите строки на свою страницу дизайна, чтобы они работали во всех браузерах, а также поместите это в код позади загрузки страницы.

$(document).ready(function () {
    $("#content_ProjectName option[value='1']").prop("selected", true);
});

1

Для меня ни одно из вышеперечисленных решений не помогло. Мне пришлось явно установить выделение, если ничего не было установлено:

if (foo.find(':selected').length === 0) {
    $(foo.find('option')[0]).attr('selected', 'selected');
}

0

Если вы измените выбор и обновите страницу, Firefox восстановит ваши изменения в форме, поэтому вам кажется, что выбор не работает. Вместо обновления попробуйте открыть ссылку на новой вкладке.


Это правда, но, похоже, не решает мою проблему. Мне все еще нужна работа, поскольку мое событие onchange не срабатывает, когда firefox восстанавливает любые изменения в форме, когда я выполняю обновление.
monkey-wrench

0

Это мое решение:

var select = document.getElementById('my_select');
for(var i=0; i < select.options.length; i++){
    select.options[i].selected = select.options[i].attributes.selected != undefined;
}

Я просто поместил это вверху страницы (с соответствующим установленным идентификатором), и у меня это работает. Заменив getElementById циклом по всем выборкам на странице, я оставлю это в качестве упражнения для читателя;).


0

На работе я только что исправил ошибку, из-за которой опция выбора правильно отображалась в Chrome, но не в Firefox, на той же веб-странице. Оказалось, что это нечто совершенно иное, чем описанные выше проблемы, но, возможно, это проблема, с которой вы столкнулись.

В Chrome цвет шрифта в поле выбора был черным. По какой-то причине в Firefox поле выбора унаследовало цвет шрифта от контейнера, который был белым. Как только я добавил правило CSS, заставляющее этот цвет шрифта выбора быть черным, набор значений был правильно отображен.


0

Ни то, autocomplete="off"ни другое не formработает для меня.

Что сработало, так это использовать только выбранный атрибут без «значения», например:

<option @(Model.Source == TermSource.Instagram ? "selected" : "")>
    Instagram
</option>
<option @(Model.Source == TermSource.Facebook ? "selected" : "")>
    Facebook
</option>

так что либо он отображает <option selected>...</option>, либо просто<option>...</option>

Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.