如何禁用WordPress页面点击iFrame时自动向上滚动？

我在网上找的代码基础上加了个iFrame，代码如下：

<iframe id="personio-iframe" style="border: none;" src="my website address is here" width="100%"  onload="window.top.scrollTo(0,0);">  
window.addEventListener('message', function(e) {    
    var iframe = document.querySelector('#personio-iframe');    
    var eventName = e.data[0];    
    var data = e.data[1];    
    switch(eventName) {      
        case 'setHeight':        
            iframe.style.height = data + 'px';        
            window.scrollTo({ top: 0, behavior: 'smooth' });        
            break;    
    }  
}, false);

现在碰到个问题：点iFrame内部任何地方，页面都会自动往上滚。我看到代码里有两行滚动相关的语句，但删掉之后iFrame就变成窄条，显示不正常。想问下怎么改代码才能去掉自动滚动，同时不让iFrame显示出问题？

修改方案 #

• 直接删掉onload属性里的window.top.scrollTo(0,0);，这行是iFrame加载完就强制滚到顶部的代码，删了不影响高度设置。
• 一定要保留setHeight分支里的iframe.style.height = data + 'px';，这行是核心——它会根据iFrame里的页面发过来的消息自动调整高度，删了就会变成窄条。
• 删掉setHeight分支里的window.scrollTo({ top: 0, behavior: 'smooth' });，这行就是点击iFrame时触发滚动的罪魁祸首。

修改后的完整代码：

<iframe id="personio-iframe" style="border: none;" src="my website address is here" width="100%">  
window.addEventListener('message', function(e) {    
    var iframe = document.querySelector('#personio-iframe');    
    var eventName = e.data[0];    
    var data = e.data[1];    
    switch(eventName) {      
        case 'setHeight':        
            iframe.style.height = data + 'px';        
            break;    
    }  
}, false);

简单说下原因：iFrame内部点击的时候，会给父页面发setHeight消息，原来的代码在调高度的同时触发了滚动。现在只留调高度的逻辑，把所有强制滚动的代码都删掉，既解决了自动滚的问题，又能让iFrame跟着内部内容自动变高，显示正常。

内容的提问来源于stack exchange，提问作者Kazeshi