typeahead.js使用时发现列表加载不全

   维护老旧项目时发现在项目中输入框的搜索建议频繁性的显示不全，和数据接口返回的结果不一致，由于项目老旧以及交接文档不全难以维护，记录一下解决思路和过程，防止下次再遇到类似问题。

1. 问题排查思路

（1）确认使用插件

查看项目代码发现搜索建议的实现使用typeahead.js插件，版本号为v0.11.1
插件官网：https://twitter.github.io/typeahead.js

（2）排查参数/方法使用错误

将所有参数和方法对照文档再过一遍，没有发现任何代码问题，但是source参数（数据来源）使用了Bloodhound对象，由于技术水平受限没有使用过Bloodhound插件，所以第一反应是不是Bloodhound插件的使用上有问题。

// source参数为skuHound方法
source: skuHound,

第一步、使用ajax请求替换Bloodhound对象

// 原项目代码
skuHound = new Bloodhound({
	datumTokenizer : Bloodhound.tokenizers.obj.whitespace('name'),
	queryTokenizer : Bloodhound.tokenizers.whitespace,
	remote : {
		url : 'XXXXXX', // 数据接口请求路径
		prepare : function(query, settings) {
			settings.type = 'post',
			settings.data = {
				'name' : query.trim(), // 请求参数
			}
			return settings;
		},
		transform : function(parsedResponse) {
			return parsedResponse.info.rows; // 返回数据
		}
	}
});
// 我的ajax请求
skuHound = function(query, process, asyncResults) {
	$.ajax({
		url: 'XXXXXX', // 数据接口请求路径
		type: 'post',
		dataType: 'json',
		data: {
			'name' : query.trim(), // 请求参数
		},
		success: function(result) {
			var names = result.info.rows;
			console.log(names)
			asyncResults(names); // 返回数据
		}
	});
};

重启项目测试后发现并没有解决问题，控制台打印结果也正确，所以排除了是Bloodhound插件的问题。

第二步、对整个搜索建议的显示过程打断点

打断点后发现typeahead.js文件中这个方法有问题，在append元素时数量计算明显不正确。

例：最大显示数量设为20，即limit参数设置为20

数组长度	插件计算的截取结束索引	截取后数组长度	结果是否正确
5	15	5	正确，数量为5
16	4	4	不正确，应为前16
30	-10	20	正确，为前20

3. 解决办法

改变插件中的方法：

function async(suggestions) {
    suggestions = suggestions || [];
    if (!canceled && rendered < that.limit) {
        that.cancel = $.noop;
        rendered += suggestions.length;
        // that._append(query, suggestions.slice(0, that.limit - rendered)); // 原代码
        that._append(query, suggestions.slice(0, that.limit)); // 改写后的代码
        that.async && that.trigger("asyncReceived", query);
    }
}