如何设置在 HTML 选择框中显示的最大项目数量答案

【问题标题】：How to set the max amount of items to show in an HTML select box如何设置在 HTML 选择框中显示的最大项目数量
【发布时间】：2010-10-10 01:23:21
【问题描述】：

我有一个<select> 框，里面有一些年份数字，范围为 50 年前，目前当我点击该框时，选项将到达屏幕的最底部，有没有办法设置最大值在使用滚动条显示其余选项之前，选择框应该显示多少选项？我在 Google 上找不到任何相关信息，唯一接近的是 size 属性，这真的不是我想要的。

【问题讨论】：

使用一些 Javascript 是可能的

标签： html css

【解决方案1】：

我认为您不能这样做的原因（抱歉）是因为这些通常是作为操作系统原生控件实现的，这也意味着它们在不同的浏览器/平台中的行为不同。

【讨论】：

混蛋，太糟糕了。也许我的老板会让我少展示几年：P

【解决方案2】：

不，这是不可能的。

您可以做一些棘手的 JavaScript/AJAX 事情，但通常有更好的解决方案。 ;)

【讨论】：

【解决方案3】：

使用 Javascript 可以获得类似的效果。这离你更近吗？

<select id="mySelect" 
            onfocus="this.size=4" 
            onblur="this.size=1"
            onmouseleave="this.size=1">
    <option>1</option>
    <option>2</option>
    <option>3</option>
    <option>4</option>
    <option>1</option>
    <option>2</option>
    <option>3</option>
    <option>4</option>
    <option>1</option>
    <option>2</option>
    <option>3</option>
    <option>4</option>
</select>

当然，您的非 JavaScript 用户仍然会获得巨大的下拉列表。

【讨论】：

【解决方案4】：

@Aistina - 你的问题是指纯 CSS 和 HTML。
正如 teknohippy 和 Lennart 所写，如果您可以\想要包含 JavaScript，您可以获得所需的效果。
您可以构建自己的选择或文本框 (example) 或使用控件来执行此操作 (example)

【讨论】：