选择列表滚动到特定选项元素 [英] Select list scroll to a specific option element

问题描述

我有一个带有年份的选择框。第一个选项是空的。当我点击选择列表时，我希望滚动条自动向下滚动。我尝试过使用scrollTop，但它只适用于FireFox。

I have a select box with years. First option is empty. When I click on select list I want scrollbar to scroll automaticaly down . I've tried with scrollTop but it's working only in FireFox.

前：

<select id="mySelect">
<option selected="selected" value=""></option>
<option value="1911">1911</option>
<option value="1912">1912</option>
<option value="1913">1913</option>
<option value="1914">1914</option>
<option value="1915">1915</option>
<option value="1916">1916</option>
<option value="1917">1917</option>
<option value="1918">1918</option>
<option value="1919">1919</option>
<option value="1920">1920</option>
<option value="1921">1921</option>
<option value="1922">1922</option>
...

</select>

推荐答案

选择点击/焦点有点复杂，实际上。这就是你想要的：

Select click/focus is a bit more complicated, actually. This is what you want:

$('#mySelect').focus(function(){

    if($(this).data('focused') !==  true)
    {
        $(this).data('focused',true);  
        $(this).children(':last-child').prop('selected',true);
    }

});

$('#mySelect').blur(function(){
    $(this).data('focused',false); 
});

工作示例： http://jsfiddle.net/AlienWebguy/zuJrK/

这篇关于选择列表滚动到特定选项元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！