Как изменить текст по умолчанию для сафари для мобильных устройств "0 элементов" при использовании атрибута "multiple" тега "select"?

Я использую атрибут multiple "в теге html select".

<select multiple>
   <option>1</option>
   <option>2</option>
   <option>3</option>
   <option>4</option>                         
</select>

В мобильном сафари по умолчанию отображается " 0 элементов" в поле. Когда я выбираю более 1 пункта, скажем 3, тогда в поле отображается " 3 элемента".

Можно ли изменить текст по умолчанию из "0 элементов" на что-то еще, например "Выбрать опцию (ы)"?

Ответы

Ответ 1

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

<option disabled selected class="hidden">Select option(s)</option>

где класс скрыт просто:

.hidden { display:none; }

затем в фокусе удалите атрибут/свойство "selected" первого параметра с помощью jquery:

$('select').on('focus', function() {
    $(this).children(':first-child').removeProp('selected');
}