选择输入标签 - 单击时选择中间日期

Question

我目前拥有标准选择输入多年。目前，当单击时，它会显示一长串从 1900 年到 2000 年的年份列表，需要您向下滚动。

有没有办法让它在单击时出现在中间，以便您可以向上或向下滚动？

我希望这是有道理的！

Answer 1

使用 selected 属性

 <select name="years">
    <option>1900</option>
    <option>1901</option>
    <option>1902</option>
    <option>1903</option>
    <option>1904</option>
    <option selected="selected">1905</option>
    <option>1906</option>
    <option>1907</option>
    <option>1908</option>
    <option>1909</option>
    <option>1910</option>
    </select>

示例：http://jsfiddle.net/tnU4K/

Answer 2

对于下拉 元素？不是以标准化的跨浏览器方式。某些浏览器可能（未经测试）允许您在列表可见时操作 select 元素的 scrollTop 属性，但我不会指望它。从中间开始的唯一方法是默认选择中间年份。

就我个人而言，我不会打扰。大多数用户都知道，无论如何，他们可以在聚焦 元素的同时进行键入 - 我很少使用鼠标在下拉 中选择选项。

Answer 3

在默认选择的中间（可能是 1950）附近设置一个值。当有人单击选择时，所选值将可见，因此您可以向上或向下滚动。

Answer 4

你总是可以疯狂地使用 jquery 做这样的事情：

//get number of options
var optCount = $('#example option').length;
//divide by 2 and round up for odd numbers
var midPoint = Math.round(optCount/2);
//select that index item
$("#example option:eq(midPoint)").attr("selected", "selected");

我还没有测试过，但它应该可以工作。