html5 выбирает элемент управления с длинным текстом на мобильных устройствах

#android #html #select #mobile

#Android #HTML #выберите #Мобильный

Вопрос:

Я разрабатываю мобильный веб-сайт с html5 (не приложение).

На веб-сайте у меня есть элемент управления выбором (выпадающий список), который содержит очень длинный текст. Когда я показываю веб-сайт на мобильном телефоне с Android (например, Galaxy s4) в браузере по умолчанию, когда я касаюсь кнопки выбора, частично отображаются параметры с длинным текстом, а после этого отображаются точки.

Важно отображать весь текст, потому что есть варианты, которые почти одинаковы, только слова в конце отличаются.

Я нашел решение для ios, чтобы добавить <optiongroup> в конце опции, но это не помогло в Android.

Ответ №1:

Попробуйте это, это поможет вам

   <!-- On page load, be sure that something else has focus. -->
  <body onload="document.getElementById('name').focus();">
  <input id=name type=text>

  <!-- This div is for demonstration only.  The parent container may be anything -->
  <div style="height:50; width:100px; border:1px solid red;">

  <!-- Note: static width, absolute position but no top or left specified, Z-Index  1 -->
  <select
   style="width:96px; position:absolute; z-index: 1;"
   onactivate="this.style.width='auto';"
   onchange="this.blur();"
   onblur="this.style.width='96px';">
  <!-- "activate" happens before all else and "width='auto'" expands per content -->
  <!-- Both making a selection and moving to another control should return static width -->

  <option>abc</option>
  <option>abcdefghij</option>
  <option>abcdefghijklmnop</option>
  <option>abcdefghijklmnopqrstuvwxyz</option>

  </select>

  </div>

  </body>

  </html>
  

текст будет показан вам без точки .. попробуйте это и позвольте мне сообщить