javascript - 如何滚动到父 iframe 的顶部按下 iframe 内的按钮?

标签 javascript jquery html css iframe

该页面来自 eBay 列表。 这是主要结构:

<html>
<body>
<iframe src="http://vi.vipr.ebaydesc.com/" />
</body>

主要的 html 位置是 ebay.co.uk,而 iframe 来自另一个域。

在 iframe 内部我有一个按钮 #totop 并且在按下时我希望主 html 滚动到页面顶部,而不是 iframe 内容。

这可能吗?

最佳答案

如果您无法控制父站点(在本例中为 ebay.co.uk),则不可能。如果您不想将脚本定位到父站点,协议(protocol)、域和端口必须匹配。

如果这些框架使用相同的域,这将起作用:

<button id="totop" onclick="window.parent.parent.scrollTo(0,0)">
  Scroll parent to top
</button>

如果您可以控制父网站 (ebay.co.uk) 的网络服务器,您可以创建一个反向代理来欺骗系统。例如,在 Apache httpd 中,您可以像这样创建一个反向代理:

ProxyPass /iframe http://vi.vipr.ebaydesc.com
ProxyPassReverse /iframe http://vi.vipr.ebaydesc.com

并将 iframe 的 src 设置为 http://ebay.co.uk/iframe

<iframe src="http://ebay.co.uk/iframe"></iframe>

这将允许您将脚本从 iframe 定位到 ebay.co.uk。

无论如何,在这种情况下这是不可能的。

关于javascript - 如何滚动到父 iframe 的顶部按下 iframe 内的按钮?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25033213/

相关文章:

右侧的 jQuery Offcanvas 菜单

html - 如何在 CSS 中垂直居中内联元素

javascript - 简单的 javascript "feature"面板

javascript - Firefox 中的 D3.js 转换错误?

javascript - AngularJS : Scope value changing, 但并不总是应用 ng-class

javascript - 使用 jQuery 获取表列总和的问题

javascript - 正则表达式匹配所有不在引号内的实例

javascript - 如何在 Featherlight 灯箱中获取当前幻灯片和总幻灯片?

javascript - Bootstrap 4 - 嵌套导航链接仅在第一次打开选项卡内容

javascript - 使用 jQuery 为每个 div 添加标签