防止按钮重复点击

AI权益加码!Claude Code、Cursor等20+工具免费用! 购周边限时加赠Coding Plan Lite,畅享主流AI工具!学习进阶更高效! 阅读详情

App中,有很大一部分场景是点击按钮,向服务端提交数据,由于网络请求需要时间,用户很可能会多次点击,造成数据重复提交,造成各种莫名其妙的问题。因此,防止按钮多次点击,是Android开发中一个很重要的技术手段。

下面介绍两种解决方式:

      1.每个按钮点击事件中,记录点击时间,判断是否超过点击时间间隔

private long mLastClickTime = 0;
public static final long TIME_INTERVAL = 1000L;
private Button btTest;
private void initView() {
    btTest = findViewById(R.id.bt_test);
    btTest.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            long nowTime = System.currentTimeMillis();
            if (nowTime - mLastClickTime > TIME_INTERVAL) {
                // do something
                mLastClickTime = nowTime;
            } else {
                Toast.makeText(MainActivity.this, "不要重复点击", Toast.LENGTH_SHORT).show();
            }
        }
    });
}

这种方式,每个点击事件都需要写一个时间判断,重复代码很多。

     2.封装一个点击事件,处理点击间隔判断

public abstract class CustomClickListener implements View.OnClickListener {
    private long mLastClickTime;
    private long timeInterval = 1000L;

    public CustomClickListener() {

    }

    public CustomClickListener(long interval) {
        this.timeInterval = interval;
    }

    @Override
    public void onClick(View v) {
        long nowTime = System.currentTimeMillis();
        if (nowTime - mLastClickTime > timeInterval) {
            // 单次点击事件
            onSingleClick();
            mLastClickTime = nowTime;
        } else {
            // 快速点击事件
            onFastClick();
        }
    }

    protected abstract void onSingleClick();
    protected abstract void onFastClick();
}

使用:

btTest.setOnClickListener(new CustomClickListener() {
    @Override
    protected void onSingleClick() {
        Log.d("xxx", "onSingleClick");
    }

    @Override
    protected void onFastClick() {
        Log.d("xxx", "onFastClick");
    }
});

相比于第一种方式,这种方法将重复点击的判断封装在CustomClickListener内部,外部无需处理时间判断,只需要实现点击方法即可。

3. 这种需求常见于点击按钮启动Activity的场景,所以比较简单实用的一种方案是:重写startActivity(),判断两次点击时间差

/**
     * 防止快速点击启动多次activity --开始
     */
    @Override
    public void startActivity(Intent intent) {
        if (startActivityCheck()) {
            super.startActivity(intent);
        }
    }

    private long mActivityJumpTime;

    private boolean startActivityCheck() {
        if (mActivityJumpTime >= (System.currentTimeMillis() - 500)) {
            Log.d("chg","屏蔽快速点击");
            return false;
        }

        mActivityJumpTime = System.currentTimeMillis();
        return true;
    }
    /** 防止快速启动多次activity --结束*/

 

AndroidAndroid防止过快点击造成多次事件执行(防止按钮重复点击 在用户使用 Android 应用的时候,经常会出现过快且多次点击同一按钮的情况,一方面这是因为应用或手机当前有些卡顿,另一方面也可能是由于很多应用并没有设置按钮点击时的 selector 或者其它按钮响应方式(例如点击按钮按钮放大,常见于游戏),导致用户误认为没有点击到当前按钮,当然,除了相对应的对应用进行优化和设置点击selector以外,我们还可以做一些其它的工作,例如,判断按钮的 onCli 阅读详情

相关推荐

Vue全局指令防止按钮重复点击

1.common.js 首先引入Vue import Vue from 'vue'; const preventReClick = Vue.directive('preventReClick', { inserted: function (el, binding) { el.addEventListener('click', () => { if (!el.disabled) { el.disabled = true setTimeout

吴小花的博客 1932

Android开发中防止重复点击的方法

Android开发中防止重复点击

mikehot的博客 1242

解决按钮短时间内被多次点击的问题

多次点击一次调用,这个代码是用来解决一个按钮在短时间内被多次点击,被多次调用的问题的。这是一个简单的小例子,最大的优点就是简单。

【前端】如何优雅的解决按钮重复点击”问题

在项目中会有很多**按钮点击调取接口**的需求(比如:`提交`操作),很多业务用户会不自觉点两次或多次,就导致按钮**click方法会多次触发**,导致最后保存了**好几条一模一样的数据**,就会出现`脏数据`的情况......

weixin_55846296的博客 1万+

前端按钮防重

前端按钮防重

jkhedge的博客 819

如何解决按钮重复点击

这些问题如果处理不当,轻则影响用户体验,重则可能造成数据错误。然后封装一个通用的 Button 组件。我们可以封装一个自定义 Hook。

m0_70547044的博客 287

flutter按钮防止多次点击

节流就是减少流量,将频繁触发的事件减少。n 秒内只运行一次,若在n秒内重复触发,只有一次生效。如限制1s,则1s内只执行一次。防抖可以概括为触发高频事件后n秒内函数只会执行一次,如果n秒内高频事件再次被触发,则重新计算时间。如果某一事件被连续快速地触发多次,只会执行最后那一次。1.防抖(debounce)2.节流(throttle)

m0_53480384的博客 1104

JavaScript 中按钮控制中防止重复点击的实现

JavaScript 中按钮控制中防止重复点击的实现

李长渊的博客 1506

vue防止按钮重复点击方案

本文总结了Vue中防止按钮重复点击的4种方案:1)禁用按钮与状态锁定,通过isLoading控制按钮状态;2)使用CSS的pointer-events属性禁用点击;3)自定义指令实现统一防重逻辑;4)使用防抖函数延迟执行。重点推荐自定义指令方案,可复用性强,支持配置防抖时间和加载状态。文中提供了完整的代码示例,包括禁用样式、加载动画等实现细节,适用于表单提交等常见场景。

qq_44136028的博客 1191

防止提交按钮重复点击的实践

防止按钮重复点击 按钮是前端界面中承接着用户操作的很重要的一个环节,前端界面用户和系统的交互都通过按钮来完成,与系统的交互自然就少不了把用户的意向保存到系统中,如今面对前后端分离的部署方案,前端与后端的通信都是通过接口来完成的。那么问题就来了发送一个接口就需要等待,那么等待的这段时间可长可短(根据用户当前的网络时间决定的),如果一个请求三秒以后才回来,用户在这一段时间再次点击怎么办。在如今这个网速很快的时代,可能延迟是非常低的,所以给用户考虑的时间并不多,但是如果请求时间长重复点击就需要做限制了。本次就是

YS182118的博客 1059

防止按钮重复点击

避免一个button被多次点击(共总结了3种) 第一种:每次在点击时先取消之前的操作 将这段代码放在你按钮点击的方法中,例如: 1 2 3 4 5 -(void)buttonClicked:(id)sender{ //点击按钮后先取消之前的操作,再进行需要进行的操作 [[selfclass]cancelPreviousPerfor...

diyong1866的博客 247

vue中防止按钮重复点击的方法

使用Vue.directive()来自定义全局注册指令,在main.js中加入下方这段代码,可以全局应用// 防止el-button重复点击if (!})});接着在el-button中添加v-preventReClick,就可实现效果,在点击之后按钮变为禁用状态,持续禁用两秒,两秒之后便可再一次提交// 添加新属性<el-button type="primary" @click="handleSave" v-preventReClick>保存</el-button>

miao1128的博客 1139

Vue中防止按钮重复点击

本文介绍了三种防止按钮重复点击的实现方法:1)自定义全局指令,通过disabled属性控制按钮状态;2)改进版指令,使用pointer-events或事件阻止来增强兼容性;3)动态控制disabled属性。其中第一种方法仅适用于el-button,改进版通过阻止事件冒泡或修改CSS属性来支持普通元素。第三种方法通过Vue状态管理实现。这些方案都能在点击后禁用按钮2秒(可配置),有效防止重复提交。文章提供了完整的代码示例,包括全局/局部指令注册和动态属性控制两种实现方式。

醉殇姒若梦遗年 ツ的博客 948

防止按钮重复点击的js实现

在网页开发过程中经常遇到防止

李大爷学前端 1万+

vue.js防止按钮重复点击

情景:有时候点击按钮的代码执行比较耗时,在此期间用户如果重复点击,会造成重复执行的情况。 思路:使用一个变量state来阻止后面的代码执行,变量值默认为false,执行代码之前变为true,代码执行完毕再变为false。 代码: <div @click="handleClick"></div> data(){ return{ state:false } }...

u010007013的博客 1万+

android自定义防止重复点击,Android防止按钮重复点击示例代码

本文中我将介绍一下我自己封装的一个小的工具类库:按钮点击事件类库。作用:该类库可以防止按钮重复点击,可以判断网络状态,可以判断用户登录状态,以及自定义验证条件等等。说明:其实现的核心原理就是通过自定义实现自身的OnClickListener类,并重写其中的onClick方法,在onClick方法中执行相应的判断逻辑之后回调我们自定义的抽象方法。具体效果如下图所示:使用方式屏蔽多次点击事件/*** ...

weixin_29463345的博客 347

按钮防止重复点击(iOS)

避免一个button被多次点击(共总结了3种) 第一种:每次在点击时先取消之前的操作 将这段代码放在你按钮点击的方法中,例如: 1 2 3 4 5 - (void)buttonClicked:(id)sender{ //点击按钮后先取消之前的操作,再进行需要进行的操作 [[selfclass]cancelPrevi

iOS学习的博客 2261

Android 防止按钮多次重复点击之「防重复点击

前言 为了防止按钮”的点击事件在短时间内多次点击从而触发了多次处理操作; 比如:快速点击“登录按钮”发送了多次登录接口,导致程序在短时间内进行多次数据提交or数据处理,这样的体验就不太好了。 方法 判断用户点击按钮间隔时间,如果间隔时间太短,则认为是无效操作,否则进行相关业务处理 /** * 判断两次点击事件的间隔 */ public class ClickHelper { private static long lastClickTime = 0; /** * 判断事

fenglolo的博客 2370

uniapp--vue中按钮防止重复点击操作

最近的项目完成后,在性能优化阶段需要做按钮防止重复点击功能,下面是我考虑过的一些实现方法以及弊端,如有遗漏,欢迎大家评论区留言讨论哈~

weixin_42082342的博客 5037
上一篇: 全局监测网络变化并提示
下一篇: Android 1.5 到 10.0 新特性
JustinNick
博客等级 码龄10年 23粉丝 61原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值