jquery绑定点击事件,随着点击次数的增加,发送的网络请求也累加,该如何避免此种情况?

今天在用jQuery写项目的时候发现,当我点击部门与地方并来回切换的时候,发送的网络请求也是逐步累加。这样的情况很影响性能,很难通过压力测试。

之所以会出现这样的原因是绑定的点击事件不是每点击一次就替换上一次的数据,他是逐步累积的。解决这个方法:再合适的时机对它进行清空处理。

这是之前的写法
$(".nav")
    .on("click", ".text4", function () {
      const word = $(this).text();
      getList1(word);
      $(this).addClass("bh").siblings().removeClass("bh");
      $(".active0").removeClass('active0')
    });
  $(".unfold")
    .on("click", ".text6", function () {
      $(this).addClass('bh').parent().siblings().removeClass('bh')
      $(".more").removeClass("actived");
      const word1 = $(this).text();
      getList1(word1);
      $(".bumenguizhang").hide();
      $(".diviedConUl").show();
    });

解决方法
$(".nav")
    .off("click")
    .on("click", ".text4", function () {
      const word = $(this).text();
      getList1(word);
      $(this).addClass("bh").siblings().removeClass("bh");
      $(".active0").removeClass('active0')
    });
  $(".unfold")
    .off("click")
    .on("click", ".text6", function () {
      $(this).addClass('bh').parent().siblings().removeClass('bh')
      $(".more").removeClass("actived");
      const word1 = $(this).text();
      getList1(word1);
      $(".bumenguizhang").hide();
      $(".diviedConUl").show();
    }); 

这里的off()方法就相当与清空,实际上off是对我们之前的点击事件进行解绑,那么解绑了不就代表上一次的点击事件结束,所以当写上这段代码之后之前的累加效果就消失了。

 

 效果实现啦!

 

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Zwq8023520

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值