父页面上的 EventListener - 阻止通过 iFrame 滚动

Posted 2023-05-09

【中文标题】父页面上的 EventListener - 阻止通过 iFrame 滚动

【英文标题】：EventListener on parent page - Block scrolling through iFrame

【发布时间】：2021-09-24 04:03:58

【问题描述】：

我在 jQuery 上的 iFrame 事件侦听器遇到了一些问题，我需要修复的部分代码是：

function BlockScrollbar(e) 
  e.preventDefault();


$.fancybox.open(
  src: $(this).find("a:first").attr("href"),
  type: 'iframe',
  infobar: false,
  toolbar: false,
  beforeShow: function() 
    document.addEventListener('mousewheel', BlockScrollbar, 
      passive: false
    );
  ,
  afterClose: function() 
    document.removeEventListener('mousewheel', BlockScrollbar);
  
);

我禁用了整个页面上的滚轮，在加载 iFrame 期间，问题是由于某种原因，如果我通过 iFrame 滚动页面，我仍然可以滚动后面的页面。

我的目标是在打开 iFrame 时完全禁用滚动。你知道为什么它不能 100% 工作吗？谢谢。

【参考方案1】：

由于我打开 iFrame，整个文档能够滚动，尽管它导致事件侦听器基于第一页。我通过在 iFrame 打开的页面上添加一个 ready(function() 来解决此问题。

function BlockScrollbar(e) 
  e.preventDefault();



(function($) 

$(document).ready(function() 


document.addEventListener('mousewheel', BlockScrollbar, passive: false);

);
)(jQuery);

【参考方案2】：

你可以试试这些吗？

 function BlockScrollbar() 
 window.parent.document.$('body').bind('touchmove', function(e)
  e.preventDefault();
 );

【讨论】：

我刚试了一下，页面仍然以相同的方式工作，滚动到处都被阻塞，但不是通过 iFrame

我已经编辑了我的答案，你可以试试吗？

对不起，还是不行，看来iFrame滚动没有受到代码的影响，因为后台正文被按预期阻止了