zoukankan      html  css  js  c++  java
  • js事件被多次触发时,如何做到只执行最后一次事件函数

    昨天遇到一个问题:微信购物车页面的数量增减按钮点击过快时,input里的值会乱跳

      看了源代码后发现,每次点击增减按钮后,整个购物车区域都通过ajax重新写入,而ajax写入是需要时间的,这就导致了点击过快时页面异步加载速度跟不上点击的速度,故此input里面的值会乱跳;

    解决方案:

      1、在点击事件外面申明一个变量

        var iTime;

      2、给ajax的触发事件添加时间间隔,

        iTime=setTimeout(fun,250);

      3、每次点击事件触发时都清除之前的setTimeout事件

        clearTimeout();

    最后代码如下:

      var iTime;

      element.onclick=function(){

        clearTimeout(iTime);

        iTime=setTimeout(fun,250);

      }

    其实上面这个方案所解决的就是事件被多次触发时,只执行最后一次事件,核心思想就是通过设置定时器来控制,通过定时器触发事件,在多次触发事件时清除之前的定时器事件,最后给定时器重新赋值,那么不管怎样都是只会运行最后一次的定时器事件。

  • 相关阅读:
    Python并发编程之多进程(实战)
    ThreadPoolExecutor源码分析
    JDK 1.8 JVM的变化
    JDK1.8 hashMap源码分析
    Spring解决循环依赖
    spring
    实现一个可重入锁和不可重入锁
    B树与B+树
    WebMagic
    Java高频面试题
  • 原文地址:https://www.cnblogs.com/webwangjie/p/7159632.html
Copyright © 2011-2022 走看看