javascript - 如何在jquery中只执行一次action？

Question

我一直在使用这个脚本在我的网站上显示模式弹出窗口，其中包含一些 QR 代码，它可以在单个页面上工作，但在类别页面上它会被调用多次，因此它会显示 10 次相同的窗口。我怎样才能限制它只在最近的 anchor 位置显示一次？

代码:

    <li class="qrcode">
    <a  class="popup-trigger"></a>

  </li> 
</ul>
<div class="contain-popup">

<div class="popup">
my qr code
  <span class="popup-btn-close">X</span>
</div>
</div>
<script>
// Popup Window
var scrollTop = '10';
var newHeight = '100';

$(window).bind('scroll', function() {
  scrollTop = $( window ).scrollTop();
  newHeight = scrollTop + 100;
});

$('.popup-trigger').click(function(e) {
  e.stopPropagation();
  if(jQuery(window).width() < 767) {
    $(this).after( $( ".popup" ) );
    $('.popup').show().addClass('popup-mobile').css('top', 0);

  } else {
    $('.popup').removeClass('popup-mobile').css('top', newHeight).toggle();
  };
});

$('html').click(function() {
  $('.popup').hide();
});

$('.popup-btn-close').click(function(e){
  $('.popup').hide();
});

$('.popup').click(function(e){
  e.stopPropagation();
});
</script>

Answer 1

实现这一目标的一个简单方法是 remove()它是同时隐藏它的html:

$('html').click(function() {
  $('.popup').hide();
  $('.popup').remove();
});