2

我有一个充满预输入搜索结果的 div。当 typeahead 绑定的输入失去焦点时,我希望将具有 typeahead 结果的 div 滚动到最顶部的位置。

我正在使用typeahead.js,所以我目前有:

$('input[name="customer"]').on('typeahead:closed', function(){
    $('div.tt-dataset-customers').scrollTop(0);
});

但是,div 永远不会滚动。认为这是由于 div 被隐藏,我也尝试过:

$('input[name="customer"]').on('typeahead:open', function(){
    $('div.tt-dataset-customers').scrollTop(0);
});

这也不起作用。

有没有办法在未显示的 div 上设置滚动位置?

小提琴显示正在发生的事情:http: //jsfiddle.net/tTdF4/

4

1 回答 1

1

编辑 v3

所以我console.log在这个上面加了一个,它从来没有被解雇过。

$('input[name="customer"]').on('typeahead:closed', function(){
    console.log('test');
});

因此,我没有typeahead()从中拆分,而是使用了 jQuery 链,现在它正在触发. 不要问我为什么它没有触发,仍然没有弄清楚:(。on()typeahead:closed

无论如何,当您键入时,这将起作用(在 chrome v29 上测试)a,向下滚动,单击外部,然后单击输入,列表将备份。

$('input[name="customers"]').typeahead({
    local: ['a','ab','ac','ad','ae','af',
            'ag','ah','ai','aj','ak','al',
            'am','an','ao','ap','aq','ar',
            'as','at','au','av','aw','ax',
            'ay','az'
    ],
    limit: 20,
    name: 'customers',
    rateLimitWait: 100,
    ttl: 300
}).on('typeahead:closed keypress', function(){
    console.log('test');
    $('div.tt-dataset-customers').animate({
        scrollTop: 0
    }, 900);
});

更新的小提琴

ps:至少在小提琴上,jquery 2.X 和 typeahead 在 IE9 上的两个脚本上都会出错(请参阅控制台),如果您使用1.9 (edge)它,它将起作用。

V3:添加keypress到侦听的事件中,因此每次有人键入内容时都会尝试向上滚动(例如,包括键入a、退格和键入b)。

于 2013-08-13T20:28:17.080 回答