监视输入频率控制AJAX请求数
大家都知道AJAX是非常好玩的东东，这几天俺在写表单验证JS的时候遇到了一问题：
在注册表单输入用户名的时候，俺采用了onkeyup事件来触发AJAX校验，就是说每打一个字，表单就会去服务器那问一下是不是这用户名可以用，Justin章同学提出这样子服务器负担会比较大，比如疯狂打100个字就会发送100个请求，而Peter饭同学建议通过监视输入频率来控制请求数
具体实现效果描述如下：
两次击键间隔少于1秒不会发送请求，直到停顿时间超过1秒后发送一坨请求
逻辑如下：
设置一个timer倒计时1秒，每次击键都会初始化timer并重新开始倒计时
在骚扰花花同学一通后得出代码如下：
var timer;
function delay() {
if (timer) clearTimeout(timer);
timer = setTimeout(AJAX,1000);
}
function AJAX(){alert("假装我是AJAX")}
注意setTimeout的函数调用在IE下是不能传递变量的，比如不能写成 setTimeout(AJAX('cat'),1000)
例子如下：
http://ooxx.me/lab/ajaxForm/landingpage.htm
有firebug的同学打开Console可以看到类似 GET http://ooxx.me/lab/ajaxForm/ajaxProxy_id.php?id=bigcat&timeStamp= 字样，表示发送了http请求，在连续输入时，是不会发送的
哈，这里还有个AJAX跨域的小东东，我用的是一个PHPproxy
点我查看源代码另存为.php，把$proxy_url改成你的AJAX服务器端就可以实现跨域使用了
订阅大猫的RSS feed,不错过一部AV~
嘿嘿，还真丰富啊。。。
要结婚了啊…… 话说上次来得是几年前了 如果不是今天翻东西翻到，估计我已经忘了还有这样叫大猫的人了 
嗯……这样…… ; 晚安...
-_-b
你居然写技术文章
Reply
BigCat:
@Leo, 囧,被鄙视了
Reply
醉倚西风:
@Leo,他 写的还是不错的 哈哈
Reply
这个太复杂。。而且增加页面代码长度。。。。我觉得因该用个按钮检查。最好跳出个小窗口：）
简单又省心哈哈：）
Reply
BigCat:
@homer, ...你这样,用户体验很不好
Reply
homer:
@BigCat, 貌似很多论坛注册采用这个功能 你找个一个脱掉看看就能有收获哈：）
Reply
BigCat:
@homer, 哈,并不是用的多的就是好的,均衡用户体验和服务器负担才是王道
Reply
homer:
@BigCat, 按道理因该有个时间数值可以调的。。。。你慢慢找找看。。。
Reply
BigCat:
@homer, 后面那个1000就是数值,单位是毫秒哈
Reply
Yacca:
@homer, 我讨厌窗口...
Reply
homer:
@Yacca, 看样子你经常被弹窗弹～
Reply
看不懂....
另 第一幅图片是什么意思呢...
Reply
BigCat:
@Enson, 因为技术文章一般都比较无聊,所以配个解闷的图...
Reply
Enson:
@BigCat, 喵rz...
Reply
怎么不用Jquery 这个淫荡的J叔叔。。。做ajax延迟判断 非常地效率··^_^
Reply
BigCat:
@飞鱼, 因为...因为...Jquery用多了,就不会用原生js了
(其实是我不会用)
Reply
飞鱼:
@BigCat, 不过貌似 挺多 大站 都是用jquery 还有用YUI 的 淘宝似乎就是用YUI 整理过来的
Reply
BigCat:
@飞鱼, 恩，国际站是基于YUI改的，叫ae.js框架哈哈
正在学～
Reply
Evance:
@飞鱼, 原理都一样的．
而且现在jQeury还没有import呢.哈 .
Reply
鹤鞋的猪。。。。
Reply
技术贴，BS
Reply
不吹水的帖子很囧～
Reply
Peter饭 ... 雷.
从效率上考虑来说，这样子客户端的压力增大了．
我觉得这种细节的事情讨论过来仔细起来最终没有一个好结果．
举例说明：
如果Timeout设置为5秒
用户用了很快的速度输完了，跳转到了下一个option item，却不会触发校验．
要等5秒到了才校验．
如果再加一个blur事件，那这一个即时校验有啥意义呢？
PD的主导性太强了 ..
还好这次我没有参加讨论..
幸甚 ..
哈哈.
另外，不要叫我＂花花＂了么.. 日
Reply
BigCat:
@Evance, 我觉得0.7 - 1秒左右是比较合理的时间,按照正常速度输入的话
对于用户:也不会反应很迟钝
对服务器:1秒超时能保证大部分时间都能连续输入,超时后才发送请求也节约了服务器资源
对本地效率,个人感觉这种程度的效率牺牲还是值得的
牵扯到各个方面,寻找一个平衡点就根据不同情况来调整了,所谓平衡点就在于那个时间到底是几秒了,哈
Reply
BigCat:
@Evance, 另外,花花啊,我决定以后不叫你花花了,好么,花花?
Reply
http://bloggermap.org/map.php?id=423
原来大猫住在太平洋中心的，凶悍！
Reply
大猫:
@cosbeta, hawaii,beauty&bikini&beach~
Reply
这个实际上只是个策略问题。。。 跟onblur事件触发相比 确实是个好办法 反应迅速 也少两次鼠标点击 嗯。。。
用onkeyup，那opera下输入中文怎么办
跨域的话 为之漫笔博客提到的JSONP我觉得挺好的 http://www.cn-cuckoo.com/2008/09/13/the-origin-of-jsonp-262.html
Reply
BigCat:
@vampire, opera不考虑了,因为根据份额,权衡投入的成本:)
感谢推荐~
Reply
setTimeout是这么用di：
setTimeout(
function(){
//YOUR_FUNC();
//YOUR_FUNC(ARGV);
//alert('hello,world')
},1000);
Reply
BigCat:
@Mac, 俺看过说明书...
Reply