使用jquery处理事件时的高延迟

使用jquery处理事件时的高延迟,jquery,performance,events,latency,Jquery,Performance,Events,Latency,我的webapp速度很慢,我开始调查原因。我想我找到了问题,但没有找到解决办法。 我使用控制台进行了分析,您可以在屏幕上看到结果。问题是每次单击时,由于单击上的事件,都会有将近1000毫秒的延迟。首先,我认为这是因为在我的代码中有太多的事件点击主体,但正如您所看到的,如果总成本为0.3%到1%,那么它与n.event.handler的97.71%相比非常小。 所以我的问题是这个延迟是从哪里来的 在我的代码中,有很多: $('html').on('click', '.class', functi

我的webapp速度很慢,我开始调查原因。我想我找到了问题,但没有找到解决办法。 我使用控制台进行了分析,您可以在屏幕上看到结果。问题是每次单击时,由于单击上的事件,都会有将近1000毫秒的延迟。首先,我认为这是因为在我的代码中有太多的事件点击主体,但正如您所看到的,如果总成本为0.3%到1%,那么它与n.event.handler的97.71%相比非常小。 所以我的问题是这个延迟是从哪里来的

在我的代码中,有很多:

 $('html').on('click', '.class', function(){ });
也许太多了


如果您认为这些内容太多:

$('html').on('click', '.class', function(){ });
您可以尝试将它们重构为一个处理程序:

$('html').on('click', function (e) {

  if (e.target.classList.contains('class')) {
       // e.target is the clicked element
      // do something here
  }

  if ($(e.target).is('class2')) {
     // you can wrap e.target into a jQuery object
     // the same way you wrap this.
     // do something else here
  }

});

另外,根据对的回答,如果您有许多动态创建的目标,您应该删除并添加回这些事件处理程序。

我们如何能够在没有看到该单击处理程序中运行的代码的情况下回答此问题?请使用
$(document).on('click','.class',function(){})
。它可能无法解决您的问题。@DanLee您正在测试事件处理程序的附件,而不是调用。您的代码中有多少个事件处理程序?10秒?100美元?1000秒?我认为1000秒比100秒更接近这个,但在这种情况下,我如何从点击中获取$('this')?“this.classList.contains('class')”,它不起作用,他找不到类。对于您在工作之前编写的e target,但在我的函数中,我使用$(this),它对我非常有用。Aw cr*p,它以前是正确的$(e.target)则等于您之前使用的美元