栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 面试经验 > 面试问答

JavaScript如何延迟.keyup()处理函数,直到用户停止键入?

面试问答 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

JavaScript如何延迟.keyup()处理函数,直到用户停止键入?

我将这个小功能用于相同的目的,即在用户停止输入指定的时间后或在触发率很高的事件中执行一个功能,例如

resize

function delay(callback, ms) {  var timer = 0;  return function() {    var context = this, args = arguments;    clearTimeout(timer);    timer = setTimeout(function () {      callback.apply(context, args);    }, ms || 0);  };}// Example usage:$('#input').keyup(delay(function (e) {  console.log('Time elapsed!', this.value);}, 500));<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><label for="input">Try it:<input id="input" type="text" placeholder="Type something here..."/></label>

这个怎么运作:

delay
函数将返回一个包装的函数,该函数在内部处理一个单独的计时器,在每次执行中,计时器都将按提供的时间延迟重新启动,如果在此时间过去之前发生了多次执行,计时器将重新设置并重新启动。

当计时器最终结束时,将执行回调函数,并传递原始上下文和参数(在此示例中,jQuery的事件对象以及DOM元素为

this
)。

更新2019-05-16

我已经针对现代环境使用ES5和ES6功能重新实现了该功能:

function delay(fn, ms) {  let timer = 0  return function(...args) {    clearTimeout(timer)    timer = setTimeout(fn.bind(this, ...args), ms || 0)  }}


转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/442084.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号