如何使选择框下拉菜单变短答案

【问题标题】：how to make the selectbox dropdown short如何使选择框下拉菜单变短
【发布时间】：2014-05-29 05:53:51
【问题描述】：

我的问题是当我在选择框生日表单上选择年份和日期时，下拉菜单太长了。我希望下拉菜单简短但有一个滚动条。

html:

<div class="col-sm-offset-1 col-sm-12">
    <div class="form-group input-group">
        <div class="btn-group input-group">
            <span class="input-group-addon">Birthday</span>
                <select name="month" class="btn btn-default" id="bmonth" data-container="body" data-placement="left" data-toggle="popover" data-content="Select your Birthday!" >                                      
                    <option>Month</option>                   
                </select>
                <select name="day" class="btn btn-default" id="bday" data-container="body" data-placement="top" data-toggle="popover" data-content="Select your Birthday!" >
                    <option>Day</option>                                
               </select>
              <select name="year" class="btn btn-default" id="byear" data-container="body" data-placement="right" data-toggle="popover" data-content="Select your Birthday!" >
                <option>Year</option>
              </select>
        </div>
        <br />
    </div>
</div>

脚本：

$(document).ready(function () {
            var month = [], day = [], year = [];

            for (var i = 1; i <= 12; i++) {
                month.push(i);
            }
            for (var i = 1; i <= 31; i++) {
                day.push(i);
            }
            for (var i = 1900; i <= (new Date().getFullYear()); i++) {
                year.push(i);
            }
            $.each(day, function (index, d) {
                $("#bday").append("<option value = '"+d+"'>"+d+"</option>");
            });
            $.each(month, function (index, m) {
                $("#bmonth").append("<option value = '"+m+"'>"+m+"</option>");
            });
            $.each(year, function (index, y) {
                $("#byear").append("<option value = '"+y+"'>"+y+"</option>");
            });
});

当前输出：

【问题讨论】：

标签： javascript jquery html css twitter-bootstrap-3

【解决方案1】：

大小限制由浏览器控制，您无法更改。

在这里回答：

Height of an HTML select box (dropdown)

这里：

Limiting the displayed height of a select drop-down

【讨论】：

我写的答案和你的一模一样。使用相同的链接。让我补充一点，唯一的解决方案是构建（或查找）自定义下拉菜单。