资讯专栏INFORMATION COLUMN

javascript防反跳技术

Channe / 314人阅读

摘要:应用场景在有分页的页面中不断点击下一页时,间隔不超过设定时间则响应最后一次点击在保存文件的时候同时保存很多文件时,可以先收集信息,再一次性保存例子在秀所有服装页面中的分页设计中在的插件保存文件的时候代码为页面上的按钮,快速不间断点击,时间的

  

应用场景

在有分页的页面中不断点击下一页时,间隔不超过设定时间则响应最后一次点击

在保存文件的时候同时保存很多文件时,可以先收集信息,再一次性保存

  

例子

在qq秀所有服装页面中的分页设计中

在grunt的插件watch保存文件的时候

  

代码

    var timeoutId = null; 
    var n = 0;
    var counter = 0;
    //button为页面上的按钮,快速不间断点击button,click时间的处理函数会调用多次,但是业务逻辑只会调用一次
    $("#button").click(function () {
        clearTimeout(timeoutId);
        console.log("n: ", ++n);
        timeoutId = setTimeout(function () {
            console.log("counter: ", ++counter);
        }, 200);
    });
    //以下可以直接拷贝到chrome的控制台执行
    var timeoutId = null; 
    var n = 0;
    var counter = 0;
    //n = 10; counter = 1;
    for (var i = 0; i < 10; i++) {
        (function () {
            clearTimeout(timeoutId);
            console.log("n: ", ++n);
            timeoutId = setTimeout(function () {
                console.log("counter: ", ++counter);
            }, 200);
        })();
    }

underscore库里面集成了一个实现防反跳的方法:debounce

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/87614.html

相关文章

  • web性能优化--高性能javascript

    摘要:用局部变量存储本地范围之外的变量值,如果它们在函数中的使用多于一次。将它的值存入一个局部变量,消除一次搜索过程。地将此值存入一个局部变量中。 总结了一下《高性能javascript》书中比较核心的点,并补充了一些点。 第一章 DOM标签 将所有 标签放置在页面的底部,紧靠 body 关闭标签的上方。此法可以保证页面在脚本 运行之前完成解析。 将脚本成组打包。页面的 标签越少,页面的加...

    ytwman 评论0 收藏0
  • Lodash 中文文档 (v3.10.1) - “Function” 方法

    摘要:参数待科里化的函数函数的数量返回返回科里化的新函数示例使用占位符该方法类似但其添加的行为由变更为的值,在整体构建中的默认值是,可以作为部分参数的占位符传入。在执行时绑定的将是缓存器函数。注意缓存器函数的缓存需要暴露缓存属性,其产物会覆盖。 Lodash 中文文档 (v3.10.1) - Function 方法 Translated by PeckZegOriginal Docs: Lo...

    iKcamp 评论0 收藏0
  • Lodash 4.0.0 更新文档

    摘要:更新文档年月日兼容性警告专注于,移除包支持放弃对的支持可以使用以继续开启支持令隐式结束链式调用队列在在调用之前返回包装器并不会打印记录从左到右记录每个值,并返回该数组在从左到右记录每个值,并返回该数组移除模块路径的分类名移除,使用 Lodash 4.0.0 更新文档 v4.0.0 2016 年 1 月 12 日 — Diff — Docs 兼容性警告 专注于 npm,移除 Bow...

    mtunique 评论0 收藏0
  • php伪造Referer请求反盗链资源

    摘要:反盗链分类我们了解了盗链对源站的危害后,自然要通过一些手段来阻止这种行为维护自己的利益。参考文章百科盗链防盗链伪造防盗链 有些产品为了防止自己的产品被盗链访问,会采用反盗链措施,如封闭型生态的音乐网站和视频网站,他们已经为了版权付费,自然不希望你免费使用他们的资源。但因为很多人专门研究盗链,因此我们也需要了解下盗链、反盗链和逃避反盗链的原理。 盗链 引用百度百科对盗链的定义: 盗链是指...

    chenatu 评论0 收藏0
  • php伪造Referer请求反盗链资源

    摘要:反盗链分类我们了解了盗链对源站的危害后,自然要通过一些手段来阻止这种行为维护自己的利益。参考文章百科盗链防盗链伪造防盗链 有些产品为了防止自己的产品被盗链访问,会采用反盗链措施,如封闭型生态的音乐网站和视频网站,他们已经为了版权付费,自然不希望你免费使用他们的资源。但因为很多人专门研究盗链,因此我们也需要了解下盗链、反盗链和逃避反盗链的原理。 盗链 引用百度百科对盗链的定义: 盗链是指...

    Drinkey 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<