Проблема форматирования выпадающего списка Jquery Mobile - PullRequest
0 голосов
/ 02 мая 2018

Не совсем уверен, почему это не работает. Каждый раз, когда я нажимаю на меню выбора, оно занимает весь экран. Я пытаюсь заставить этот выпадающий список работать как обычный выпадающий список: просто показать параметры с помощью полосы прокрутки. Я думаю, что я просто буду продолжать печатать, потому что переполнение стека настаивает на том, чтобы я добавил больше деталей к своему посту, смысл которого в основном код. Должен быть честным, я очень разозлился, что мне даже нужно быть здесь, печатать в первую очередь. Было бы замечательно, если бы МЕНЮ ВЫБОРА ПО УМОЛЧАНИЮ могло работать ПРАВИЛЬНО.

<html>
<head>
<link rel='stylesheet' href='http://code.jquery.com/mobile/1.0a1/jquery.mobile-1.0a1.min.css' />
<script src='http://code.jquery.com/jquery-1.4.3.min.js'></script>
<script src='http://code.jquery.com/mobile/1.0a1/jquery.mobile-1.0a1.min.js'></script>
</head>
<body>
<div data-role='page' style='width:300px'>
    <select name='minutesTo' id='minutesTo' data-theme='a' required>
        <option value='00'> 00 </option>
        <option value='01'> 01 </option>
        <option value='02'> 02 </option>
        <option value='03'> 03 </option>
        <option value='04'> 04 </option>                                                                                                                                                                
        <option value='05'> 05 </option>
        <option value='06'> 06 </option>
        <option value='07'> 07 </option>
        <option value='08'> 08 </option>
        <option value='09'> 09 </option>
        <option value='10'> 10 </option>
        <option value='11'> 11 </option>
        <option value='12'> 12 </option>
        <option value='13'> 13 </option>
        <option value='14'> 14 </option>
        <option value='15'> 15 </option>
        <option value='16'> 16 </option>
        <option value='17'> 17 </option>
        <option value='18'> 18 </option>
        <option value='19'> 19 </option>
        <option value='20'> 20 </option>
        <option value='21'> 21 </option>
        <option value='22'> 22 </option>
        <option value='23'> 23 </option>
        <option value='24'> 24 </option>
        <option value='25'> 25 </option>
        <option value='26'> 26 </option>
        <option value='27'> 27 </option>
        <option value='28'> 28 </option>
        <option value='29'> 29 </option>
        <option value='30'> 30 </option>
        <option value='31'> 31 </option>
        <option value='32'> 32 </option>
        <option value='33'> 33 </option>
        <option value='34'> 34 </option>
        <option value='35'> 35 </option>
        <option value='36'> 36 </option>
        <option value='37'> 37 </option>
        <option value='38'> 38 </option>
        <option value='39'> 39 </option>
        <option value='40'> 40 </option>
        <option value='41'> 41 </option>
        <option value='42'> 42 </option>
        <option value='43'> 43 </option>
        <option value='44'> 44 </option>
        <option value='45'> 45 </option>
        <option value='46'> 46 </option>
        <option value='47'> 47 </option>
        <option value='48'> 48 </option>
        <option value='49'> 49 </option>
        <option value='50'> 50 </option>
        <option value='51'> 51 </option>
        <option value='52'> 52 </option>
        <option value='53'> 53 </option>
        <option value='54'> 54 </option>
        <option value='55'> 55 </option>
        <option value='56'> 56 </option>
        <option value='57'> 57 </option>
        <option value='58'> 58 </option>
        <option value='59'> 59 </option>
    </select>
</div>
</body>
</html>

1 Ответ

0 голосов
/ 02 мая 2018

Вы добавили ширину к следующему

<div data-role='page' style='width:300px'>// this will give width to only the select element

но когда вы проверяете свой выпадающий список, он создается после того, как ваш div заканчивается. Для выпадающего списка создан отдельный div, ширина которого составляет 100% в абсолютном положении, поэтому сейчас я чувствую, что вы должны добавить статическую ширину к выпадающему меню.

https://codepen.io/aayushi_kambariya/pen/vjmJpx

.ui-page {
  width: 300px;
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...