javascript - 在新标签页中打开 iframe 源代码

标签 javascript jquery html iframe

我有一个 iframe,人们可以通过它导航到特定位置,但由于它是跨域的,所以网站上的某些 javascript 不起作用(例如查看产品历史记录...... .)

我一直在尝试找到一种方法来制作一个按钮,该按钮将获取用户在 iframe 中所在的任何页面并在新选项卡中打开该链接。

在尝试研究这是否可行时,我所能找到的只是人们在新标签页的 iframe 中打开链接,这不是我需要的。

我需要制作一个按钮,点击后将打开一个新选项卡,其中包含用户当前在 iframe 中的任何链接。

我并没有真正尝试过很多东西,因为我找不到关于这个主题的任何东西(可能是由于措辞糟糕),但我认为我最好的机会是 jquery/javascript,但是,我对 javascript 不是很流利.

所以我的问题是,是否可以在新标签页中打开 iframe url,如果可以,最有效的方法是什么?

我的 iframe 中的网站是跨域的,我无法编辑它的源。

我目前拥有的是:

<iframe id="iframe" class="frame" name="iframe" height="100%" width="100%" onload="refreshLink(this.contentWindow.location.href)"></iframe>

注意:src 在页面加载时由 javascript 设置。

在那之下我有:

                                <script>
                                var hyperLink = document.getElementById("iframe").src;

                                function refreshLink(link) {
                                    hyperLink = link;
                                    document.getElementById("button").href=hyperLink;
                                }
                                </script>

最重要的是:

<a href="#" target="_blank" class="btn btn-info" id="button">Open in R1</a>

但是,当我在任何给定时间单击该按钮时,它会打开一个新选项卡,指向我之前所在的相同 url(一个选项卡转到显示 iframe 的同一页面)。

最佳答案

我相信这应该是可能的

对于显示相同域内容的 iframe,您可以使用如下内容获取当前站点 url:

document.getElementById("myframeID").contentWindow.location.href

但是对于跨域的 iframe,当您尝试以相同的方式获取站点上的位置时,您将收到以下错误:

VM2536:2 Uncaught DOMException: Blocked a frame with origin "https://example.com" from accessing a cross-origin frame.

然而,这似乎可以从跨域 iframe 中获取正确的 URL

document.getElementById('myframeID').src

最后你可以做这样的事情(假设你通过你的标签使用 jQuery):

$('body').on('click','#button', function(){
   var url = document.getElementById('myframeID').src;
   var tabOrWindow = window.open(url, '_blank');
   tabOrWindow.focus();
 });

关于javascript - 在新标签页中打开 iframe 源代码,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37009805/

相关文章:

javascript - 我的事件监听器只触发一次,甚至运行代码都没有错误?

javascript - 如何处理这个 fetch() 类型错误?

javascript - jQuery 未捕获类型错误 : Object[object Object] has no method 'toFixed'

javascript - 网页游戏 - 将 JavaScript 变量保存到 MySQL

jquery - 使用 jQuery 在网页上拖动多个元素的可能性

javascript - 如何在不使用溢出 :hidden & position:fixed? 的情况下禁用滚动

javascript - 如何使用 JavaScript 计算器将 "Fractions"添加到输入区域?

c# - 如何在我的门户中获取全局服务?

javascript - jQuery - 使用 JSON 进行发布并接收 JSON 和 HTML

HTML - 是否有必要将对 css 文件的调用括在引号中?