码迷,mamicode.com
首页 > 其他好文 > 详细

一次前端体验优化

时间:2016-05-09 18:31:03      阅读:117      评论:0      收藏:0      [点我收藏+]

标签:

最近重构了公司一.NET开发的项目,里面看到运用自动补全功能,直接上代码:

<input name="address" type="text" id="map_address_searchtxt" maxlength="20" onkeyup="searchKeyUp();" class="input2 fl" placeholder="请输入小区、大厦等地址关键字" autocomplete="off">

原作者意图是在文本框没输完一次就执行一次后端查询,但是实际中比如输入小, 拼音 xiao 那么就会执行4次查询,用户体验非常卡,因为发送的频率太高了,直接上优化代码:

1  var timers = null;
2         function searchKeyUp(){
3             clearTimeout(timers);
4             timers = setTimeout(function(){
5                 searchKey();
6                 },350);
7         }

思路为:每次输入完判断timer是否存在,存在即清掉上一次执行动作,这样就会保持一定的延时(350毫秒,自己设);

一次前端体验优化

标签:

原文地址:http://www.cnblogs.com/renren/p/5474860.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!