Динамически изменять отображаемый выбранный текст

Question

Динамически изменять отображаемый выбранный текст

0

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

Например, если у меня есть этот выбор:

<select>
    <option>Even or Odd?</option>
    <option>Even</option>
    <option>Odd</option>
</select>

<select>
    <option value="">Pick a Number</option>
    <option value="1">One</option>
    <option value="2">Two</option>
    <option value="3">Three</option>
    <option value="4">Four</option
</select>

Когда выбрано "Нечетное", четные числа будут отключены, но если четное число уже было выбрано, когда первый выбор был изменен на "Нечетный", тогда даже если выбранный индекс для второго выбора теперь равен 0, отображаемое значение равно еще первоначальное значение.

Я в настоящее время пытался:

selects[i].selectedIndex = 0;
selects[i].value = "Pick a Number";
$(selects[i]).val("Pick a Number");
$(selects[i]).attrs("selectedIndex", 0);

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

jokulmorder 25 сен. 2013, в 21:32

Источник

Теги:

javascript

jquery

dom

1 ответ

Ещё вопросы

PSL · Accepted Answer · 2013-09-25T16-56-00.000Z

Попробуйте установить его с помощью prop и, если вы не создали его, нет встроенной функции с именем attrs.

$(selects[i]).prop("selectedIndex", 0);

И ваш val также должен работать, если у вас есть значение, определенное для вашего варианта выбора. (для первого, которого у вас нет), для второго просто используйте .val(""). Pick a Number - это не значение параметра (вместо этого оно равно ")) это отображаемый текст, но даже если некоторые браузеры позволяют указать, что в качестве значения (если значение не указано), я не думаю, что это работает в браузерах. Поэтому всегда устанавливайте атрибут value для своих параметров.

Также с тем, что вы делаете, yuo может просто сделать:

selects[i].value = "Even or Odd?"; //for your first one
selects[i].value = ""; //for your second one
selects[i].value = "Pick a Number"; //Wont work for second one because you are overriding with an empty value attribute.

спасибо, как выяснилось, наша последняя сборка использовала эффект замещения для отдельных элементов в целях стилизации. Я не знал об этом, но я буду уверен, что сделаю это в будущем. Благодарю.
На самом деле, спецификация HTML говорит, что если в <option> нет атрибута value , по умолчанию используется текстовое содержимое.
@ Barmar да, но я помню, что у меня были проблемы с более старой версией IE, если я правильно помню.
@jokulmorder Вы смешиваете vanilla js с jquery, в вашем случае должно быть достаточно ванили. Если вы можете опубликовать свой полный код о том, что вы пытаетесь сделать. Мы можем предоставить лучшие варианты, чтобы исправить это.