Question

不太确定为什么这不起作用。每次我点击选择菜单，它都会填满整个屏幕。我试图让这个下拉按照正常的下拉框执行：只需用滚动条显示选项。我想我只是要继续输入，因为堆栈溢出坚持我在帖子中添加更多细节感觉它主要是代码。说实话，我很生气，我甚至不得不在这里打字。如果DEFAULT SELECT MENU可以正常工作，那将是很棒的。

<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>

Answer 1

您已将宽度添加到以下

<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;
}

Jquery移动下拉格式问题

1 个答案: