工作版

Question

在我的弹出页面中，我有一个iframe标签，里面有一个按钮。单击此按钮时，将调用iframe脚本中包含的函数。这个函数包含对chrome.tabs.create({ url: "..."});的调用，但我一直得到“Uncaught TypeError：无法调用方法'创建'未定义”。我想原因是我在iframe中，不在弹出页面本身。

有没有办法克服这种模糊，并在iframe中创建一个新标签？

修改

这是我的代码。

以下内容加载到弹出页面的iframe中：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <link rel="stylesheet" type="text/css" href="style/frame_style.css" media="screen" />
  <script src='jquery-1.8.3.js'></script>
  <script src='scripts/frame_functions.js'></script>
</head>

<body>
  <div>
    <button value="Click to open Google in a new tab" class='new_tab_bt'></button>
  </div>
</body>
</html>

frame_functions.js：

$(document).on("click", '.new_tab_bt', function(){
  openNewTab(); 
});

function openNewTab()
{
chrome.tabs.create({ url: "https://www.google.com" });
}

Answer 1

您的代码无需任何更改即可运行，我已添加工作代码作为参考;您的目标源html页面iframe在哪里，您是如何从浏览器操作弹出窗口引用它的？如果这没有解决分享，您是如何从浏览器操作弹出窗口中引用iframe的。

工作版

的manifest.json

简单代码，已注册browser action。

{
    "name": "Iframe Holder",
    "description": "http://stackoverflow.com/questions/14429598/chrome-extension-create-tab-from-within-an-iframe-in-popup",
    "version": "1",
    "manifest_version": 2,
    "browser_action": {
        "default_popup": "popup.html",
        "default_title": "Iframe."
    }
}

popup.html

浏览器操作popup中包含的目标网页。

<html>

    <body>
        <iframe width="300" height="300" src="iframe.html"></iframe>
    </body>

</html>

Iframe.html的

使用您的代码并删除不相关的CSS文件等

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <script src='jquery.js'></script>
        <script src='iframe.js'></script>
    </head>

    <body>
        <div>
            <button value="Click to open Google in a new tab" class='new_tab_bt'></button>
        </div>
    </body>

</html>

iframe.js

使用您的代码而不做任何修改

$(document).on("click", '.new_tab_bt', function () {
    openNewTab();
});

function openNewTab() {
    chrome.tabs.create({
        url: "https://www.google.com"
    });
}

Chrome扩展程序：在弹出框中从iframe中创建标签

1 个答案:

工作版

的manifest.json

popup.html

Iframe.html的

iframe.js