带有 ScrollTo 的 Twitter Typeahead.js 不起作用答案

【问题标题】：Twitter Typeahead.js with ScrollTo not working带有 ScrollTo 的 Twitter Typeahead.js 不起作用
【发布时间】：2014-07-17 20:33:06
【问题描述】：

我有一个动态生成行的数据表 (datatables.net)。我在数据表上方有一个“搜索”框。现在，您可以开始在框中输入，我有一个预先输入选项，可以选择他们想要的行（您开始输入一个名称，预先输入给您公共汽车站名称选项，每一行都基于一个公共汽车站在巴士时刻表中）。然后您可以选择您看到的正确名称。

到目前为止，在搜索框中选择巴士站没有任何作用。您可以通过按 Enter 或单击预先输入的结果进行选择。

我想要它做的是使用 scrollTo (http://flesler.blogspot.com/2007/10/jqueryscrollto.html 版本 1.4.1) 滚动到数据表中具有该名称的行。

这是我的代码：

HTML

<div>
    <label>Search:</label>
    <input id="table_Search" class="tblSearch busStop span2 typeahead" type="text"></input>         
</div>

JAVASCRIPT

function addTableSearch(dTable, $container, schedule, stops){
       //while the bus schedule and bus schedule stops exist
        if(schedule !==undefined && schedule.stops !== undefined){
        //getting the future stops
            var notPassed = Fp.filter(schedule.stops, function (stop) { 
                                      return !stop.passed; });
                var selector =  $container
                    .typeahead({
                        source : Fp.pluck(notPassed, 'busStopName'),
                        items  : 15
                        });
                    $('#bus-tab .dataTables_scrollBody').scrollTo(selector);

 }

addTableSearch(dTable, $('.tblSearch'), schedule.content.get(), schedule.stops);

我认为我不能将“var 选择器”指定为预输入，但在从预输入中选择所需内容后，我想不出另一种触发 scrollTo 的方法。

建议/帮助，好吗？

【问题讨论】：

标签： javascript jquery html twitter datatable

【解决方案1】：

找到了我的解决方案！

    function addTableSearch(dTable, $container, schedule, stops){
   //while the bus schedule and bus schedule stops exist
    if(schedule !==undefined && schedule.stops !== undefined){
    //getting the future stops
        var notPassed = Fp.filter(schedule.stops, function (stop) { 
                                      return !stop.passed; 
                                  });
            var sequence;
            $container.typeahead({
                source : Fp.pluck(notPassed, 'busStopName'),
                items : 15,
                updater : function(item) {
                    // item is item selected from typeahead
                    var busStopArray = [];
                    $.each(schedule.stops, function(index, value) {
                        busStopArray[index] = value.busStopName
                                + " - " + value.sequence;
                        if (value.busStopName === item) {
                            sequence = value.sequence;
                        }
                    });

                var selector = 'tr[data-sequence="' + sequence + '"]';
                $('#firstSchedule-tab .dataTables_scrollBody').scrollTo(selector);
                $('#secondSchedule-tab .dataTables_scrollBody').scrollTo(selector);


}

addTableSearch(dTable, $('.tblSearch'), schedule.content.get(), schedule.stops);

【讨论】：