函数被调用n + 1次而不是一次 - 为什么？

-1

在jquery中，当我点击我的页面上名为quote_box的元素时，我有一个事件。如果你点击quote_box，弹出窗口。弹出窗口中的一件事是Facebook图标。如果您点击Facebook图标，则会转到其他事件。这个想法是，每个报价框代表一个不同的人。如果你点击一个人的报价框，那么发送到Facebook的是一个URL，其末尾有一个人的名字。函数被调用n + 1次而不是一次 - 为什么？

会发生什么情况是，您第一次点击一个报价框然后点击Facebook图标，Facebook功能被调用一次。关闭弹出窗口并点击另一个报价框，然后再次点击Facebook图标。 Facebook功能被调用两次。关闭弹出窗口并点击另一个报价框，然后再次点击Facebook图标。 Facebook功能被称为三次，等等。

有谁能告诉我为什么会发生这种情况吗？

这里是我的代码：

HTML：

<section class="container"> 
     <div class="one-fourth" id="Abby"> 
     <div class="quote_box"> 
      <div class="person_name quote">Abby McCracken</div> 
      <div class="attribution"><span class="person_age">18,</span> <span class="person_where">Greater Latrobe Senior High School</span></div> 
     </div> 
     <div class="mobile_attribution"><span class="bold">Abby McCracken, 18</span><br/>Greater Latrobe</div> 
     </div> 
     <div class="one-fourth" id="Ahjani"> 
     <div class="quote_box"> 
       <div class="person_name quote">Ahjani Williams</div> 
       <div class="attribution"><span class="person_age">17,</span> <span class="person_where">Aliquippa Senior High School</span></div> 
     </div> 
    ... 
</section> 

<div id="popup_player"> 
    <div id="popup_social"> 
     <i class="fa fa-facebook videoFBlink" aria-hidden="true"></i> 
     <i class="fa fa-times"></i> 
    </div> 

    <video id="person_video" controls playsinline poster="img/mobile_video_still.jpg"> 

    </video> 
</div>

的jQuery：

$('.quote_box').on('tap', function() { 
     $('.mask').fadeIn(); 
     //get video file name 
     thisID = $(this).parent().attr('id'); 

     //if click facebook icon for this video 
     $('.videoFBlink').on('tap', function() { 
      posttoFB(thisID); 
      return false; 
     }); 


    }); 
function posttoFB(shareFile) { 
     console.log(shareFile); 
     if (shareFile !== undefined) { 
      var shareurl = "https://mywebsite?file=" + shareFile; 
     } else { 
      var shareurl = "https://nmywebsite"; 
     } 
     window.open('https://www.facebook.com/sharer/sharer.php?u='+escape(shareurl)+'&t='+window.location, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=300,width=600'); 
    }

来源

2017-06-16 LauraNMS

那是因为你设置多个 “抽头” 事件（一个内部一倍）

$('.quote_box').on('tap', function() { 
    $('.mask').fadeIn(); 
    //get video file name 
    thisID = $(this).parent().attr('id'); 

    //if click facebook icon for this video 
    $('.videoFBlink').off("tap").on('tap', function() { 
     posttoFB(thisID); 
     return false; 
    }); 


});

来源

2017-06-16 18:00:22

谢谢！而已！只要我被允许，我会尽快将其标记为答案。 – LauraNMS

很高兴提供帮助。干杯! –

你有一个嵌套的偶数t处理程序。您创建了触发创建另一个事件的事件。您可以创建一个事件处理程序，而无需显示当前对象。我建议不嵌套这样的事件：

 var currentID = 0; 

     $('.quote_box').on('tap', function() { 
      $('.mask').fadeIn(); 
      //get video file name 
      currentID = $(this).parent().attr('id'); 
     }); 

    //if click facebook icon for this video 
      $('.videoFBlink').on('tap', function() { 
       posttoFB(currentID); 
       return false; 
      }); 

    function posttoFB(shareFile) { 
      console.log(shareFile); 
      if (shareFile !== undefined) { 
       var shareurl = "https://mywebsite?file=" + shareFile; 
      } else { 
       var shareurl = "https://nmywebsite"; 
      } 
      window.open('https://www.facebook.com/sharer/sharer.php?u='+escape(shareurl)+'&t='+window.location, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=300,width=600'); 
     }

来源

2017-06-16 18:05:28

函数被调用n + 1次而不是一次 - 为什么？

回答

相关问题