Javascript 下拉自动滚动至所选数据

我有一个使用

方法的下拉列表。我在选择数据和突出显示所选数据时没有显示问题。默认情况下，输入中将显示最近（将来）的时间。我希望

onclick（第一次）在输入上显示下拉列表，并自动转到（滚动到）相应的值（最近的（将来的）时间）

就像你点击输入，然后选择数据（例如：23:00），然后关闭列表。当您再次单击输入时，列表将显示，并在末尾自动滚动以显示以前选择的数据（23:00）

希望你能理解我的意思

这是我的钥匙

谢谢。
试试这段代码

$('#textin1').click(function() {
        var pos = $('#textin1').offset();
        pos.top += $('#textin1').width();

        $('#dropdown').fadeIn(100);
       $('#dropdown').scrollTop($('#dropdown').find('li:contains("'+$('#textin1').val()+'")').position().top);
        return false;
    });

请参见js fiddle

这个会,


读取当前时间
UL将出现一张漂亮的幻灯片
UL
将滚动到视图中心相应的
li
设置时间
丑陋的滚动条只会出现在
UL
hover上

改进的jQuery：

$(function(){ // DOM ready

  var $dd = $('#dropdown');
  var $t1 = $('#textin1');
  var $currHoursLI = $('li', $dd).eq( new Date().getHours() );
                                 // or use manually  i.e. .eq(23) to test

  $t1.click(function( e ) {
    e.stopPropagation();      
    var dH = $dd.height();
    var pos = $(this).offset(); 
    pos.top += $(this).width();   
    $currHoursLI.addClass('selected'); 
    $dd.stop().slideDown(200, function(){
       var liPos = $currHoursLI.position().top;
      $(this).animate({scrollTop : liPos-dH+dH/2}, 500);
    });      
  });

  $('li', $dd).click(function() {
    $t1.val($(this).text());
    $('li', $dd).removeClass('selected');
    $(this).addClass('selected').parent($dd).slideUp(200);
  });

  //to hide listing when on click anywhere
  $(document).click(function(e) {
    var t = e.target;
    if (!$(t).is($t1) && !$(t).parents().is($t1))$dd.slideUp(200);
  });

});

略好的CSS：

#dropdown {    
    margin:0;
    padding:0;
    position:absolute;
    display:none;
    border:1px solid #A4A4A4;
    width:100px;
    height:200px;
    background:#f9f9f9;
    text-align:center;
    list-style:none;
    overflow:hidden;
}
#dropdown:hover{
    overflow-y:scroll;
}
#dropdown li:hover, #dropdown .selected{
    background:#ccc; 
    cursor:pointer; 
}

以便澄清；你想要的是它自动滚动到当前时间？我认为这有助于解决你的问题。如果你想找到他们的本地时间，可以看看这里：@user缓存你的选择器
var$el=$（“#元素”）