关于 input 输入搜索的优化
2017-11-28 本文已影响10人
许Y1世承诺
很多时候我们都会利用 input 的 change 事件做搜索功能,如果触发 change 事件不做处理就直接去请求数据或者处理数据会做很多次操作,所以我们在 change 事件里面需要做个处理减少数据的请求或处理次数。
var searchTimeout,
delayTime = 400,
submitSearch = function() {
// do something ...
};
// 搜索
$(searchInput).change(function () {
// 存在定时器则清除定时器
!!searchTimeout && clearTimeout(searchTimeout);
// 重新设置定时器
searchTimeout = setTimeout(submitSearch, delayTime);
});
思路就是利用定时器做个延迟的搜索,这样输入相隔时间小于 delayTime 的时候不会去处理搜索,当输入完成再去处理搜索。