Question

我正在使用jQuery的每个函数，点击当前即$（这个）我正在执行JS代码，如果你查看下面的代码会更清楚

$('.switch-cal').each(function(){
    $(this).on( 'click', function( e ){
         ....  CODE HERE ....

请告诉我使用“.e”在“.each”功能中使用“this”的正确方法。

谢谢。

Answer 1

<强> 1。简答：不需要each：

不要在click内使用each ...你不需要使用jQuery。它为大多数操作（包括事件处理程序）自动处理集合：

<强> e.g。

$('.switch-cal').click(function(){
    //$(this) is the calendar clicked
         ....  CODE HERE ....

<强> 2。尝试委托处理程序：

使用单个委托事件处理程序（附加到最近的非更改祖先元素，或者document，如果没有方便），通常会更方便。委派事件的最佳功能是它们可以处理甚至还不存在的元素！：）

运行时开销非常低，因为它们只需要将选择器应用于bubble-chain中的元素。除非你每秒处理50,000次鼠标操作，否则速度差异可以忽略不计，因此对于鼠标事件，不要被荒谬的低效率声称（如下面的选民咆哮）。这些好处通常会超出任何额外开销。 没有人每秒点击50,000次！：

e.g。

$(document).on('click', '.switch-cal', function(){
    //$(this) is the calendar clicked
         ....  CODE HERE ....

委托事件通过侦听事件（在本例中为click）将DOM冒泡到不变的祖先元素来工作。它然后应用选择器。它然后调用导致事件的每个匹配元素上的函数。

非变化元素越接近所讨论的元素越好，减少所需的测试次数，但如果没有其他方便，document就是你的后退。请勿使用body，因为它存在与样式相关的问题，这意味着事件可能无法触发。

Answer 2

@TrueBlueAussie有正确的答案。您应该使用单个委托事件。

$(document).on('click', '.switch-cal', function(){ //$(this) is the calendar clicked .... CODE HERE ....

如果你想保留你的“这个”范围，你可以

$('.switch-cal').each(function(){ $(this).on( 'click', function( e ){ .... CODE HERE .... }.bind(this)) });