通过节流阀前端防止重复提交事件

妖狐艹你老母 2021-09-07 06:14 329阅读 0赞

### 案例一 ###

//定义一个属性，提交成功后会将属性修改为false，点击第二次的时候就会进入else
        var falg = true;
        //点击事件
        $("#save").click(function () {
            //判断属性是否为true
            if(falg ==true){
                var options = ajaxFormOptions('post', '/admin/student/create', addDialog, $table);
                //校验输入框是否为空
                var valid = $("#form").valid();
                //判断是否校验通过
                if(valid){
                    //校验成功，将属性改为false
                    falg = false;
                    //提交保存
                    $('#form').ajaxSubmit(options);
                }
            }else {
                notyError("点击成功，稍等片刻，请不要重复点击保存按钮！");
            }
        });

### 案例二 ###

钢琴版导航条 
    节流阀  ：按下的时候，触发，如果没弹起，不让触发下一次
     //1. 定义一个flag
        var flag = true;
      按下1-9这几个数字键，能触发对应的mouseenter事件
     $(document).on("keydown", function (e) {
       if(flag) {
         flag = false;
         获取到按下的键
         var code = e.keyCode;
         if(code >= 49 && code <= 57){
             触发对应的li的mouseenter事件
           $(".nav li").eq(code - 49).mouseenter();
         }
       }
     });
    弹起的时候，触发mouseleave事件
     $(document).on("keyup", function (e) {
       flag = true;
       获取到按下的键
       var code = e.keyCode;
       if(code >= 49 && code <= 57){
         触发对应的li的mouseleave事件
         $(".nav li").eq(code - 49).mouseleave();
       }
     });

发表评论取消回复

表情：

评论列表（有 0 条评论，329人围观）

还没有评论，来说两句吧...

相关阅读

相关 uni-app 表单防止重复提交（前端）

做项目时经常遇到表单重复提交的问题小编带来这一种有效的防止重复提交本人测试有效上代码： <form @submit="examine"> <button form-t

喜欢ヅ旅行/ 2023年02月22日 07:41/ 0 赞/ 18 阅读

相关 mysql 重复提交_mysql防止重复提交解决方案

mysql防止重复提交解决方案 1.案例场景我们平时在做web项目过程中避免不了需要往数据库表中插入或者批量插入数据，比如现在有一张会员表 t\_member(id,c

矫情吗；*/ 2023年01月11日 08:20/ 0 赞/ 185 阅读

相关 spring boot 防止重复提交

服务器端实现方案:同一客户端在2秒内对同一URL的提交视为重复提交上代码吧 pom.xml <?xml version="1.0" encod

以你之姓@/ 2022年12月08日 05:17/ 0 赞/ 171 阅读

相关防止前端按钮重复提交数据问题

一、问题导入当我们在页面进行点点点的操作时，很可能遇到点击两次的行为，这时候提交或保存按钮也没有进行校验，很可能保存两份数据，因此，作为开发人员，对需要保存类似的按钮进行

一时失言乱红尘/ 2022年09月16日 13:24/ 0 赞/ 207 阅读

相关防止订单重复提交

Struts 2已经内置了能够防止用户重复提交同一个HTML表单的功能。它的工作原理：让服务器生成一个唯一标记，并在服务器和表单里各保存一份这个标记的副本。此后，在用

Love The Way You Lie/ 2022年06月17日 02:19/ 0 赞/ 249 阅读

相关 Springmvc防止重复提交

防止重复提交是以自定义拦截器为基础的，所以要想防止重复提交，我们需要自定义一个拦截器拦截器原理如下所示： ![这里写图片描述][SouthEast] 自定义拦截器

今天药忘吃喽~/ 2022年06月05日 05:07/ 0 赞/ 293 阅读

相关 pafa防止重复提交

pafa防止重复提交的主要代码： HttpSession session = request.getSession(false); String str

清疚/ 2022年04月14日 06:21/ 0 赞/ 291 阅读

相关防止表单重复提交(只通过后台实现)

1.背景与介绍：平时开发的项目中可能会出现下面这些情况： 1. 由于用户误操作，多次点击表单提交按钮。 2. 由于网速等原因造成页面卡顿，用户重复刷新提交页面。

谁践踏了优雅/ 2022年02月27日 03:20/ 0 赞/ 418 阅读

相关 .NET防止重复提交

解决方法一：前台按钮： <asp:Button ID="Button1" runat="server" OnClick="Button1\_Click" Text="Bu

灰太狼/ 2021年12月04日 05:55/ 0 赞/ 354 阅读

相关通过节流阀前端防止重复提交事件

案例一 //定义一个属性，提交成功后会将属性修改为false，点击第二次的时候就会进入else var falg = true;

妖狐艹你老母/ 2021年09月07日 06:14/ 0 赞/ 330 阅读