如何从iFrame内部滚动到iFrame的顶部 [英] How to scroll to top of iFrame from inside iFrame

问题描述

我有一个iframe，已加载到相同来源的页面中.该iframe具有两个可见的div.单击按钮将隐藏当前活动的div，并使另一个div可见.这正在工作.

I have a single iframe, loaded into the page of same origin. This iframe has two divs that are visible one or another. With a click of button the currently active div is hidden and another div is made visible. This is working.

问题是，单击button后，下一个div可见，但div的按钮在屏幕上.我想滚动到div的顶部，使其可见.

The problem is, after clicking on the button, the next div is visible but the buttom of the div is on the screen. I wanted to scroll to top of the div when it is made visible.

我尝试过的代码: 代码段1

$('form').on('submit', function(e) {
  // other code to handle visibility
  window.scrollTo({
    top: 0,
    behavior: 'smooth'
  });
}

可在Page本身上运行，但不能作为iframe嵌入到其他页面中.

代码段2

$('form').on('submit', function(e) {
  // other code to handle visibility
  window.parent.scrollTo({
    top: 0,
    behavior: 'smooth'
  });
}

到达父页面的顶部

如何修改此代码以将我带到iframe的顶部?

How can I modify this code to take me to the top of iframe?

推荐答案

我能够解决此问题.

这是有效的代码.

$('form').on('submit', function(e) {
  // other code to handle visibility
  $('.step2')[0].scrollIntoView();
  // step2 is the class name of the second div 
  // that is to be visible
}

这篇关于如何从iFrame内部滚动到iFrame的顶部的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！