将控制转移到新的 window - chrome 打包应用程序

Question

如何将控制权转移给新 window？我正在开发具有多项 window 功能的 chrome 打包应用程序。假设我点击 "new window" 它打开了一个新的 window 这是我使用的代码：

background.js:

function create_window(opt_options)
{
    chrome.app.window.create("main.html", opt_options,

    });
}

在创建新的 window 之后，我只是简单地填充 div

中的值

main.html

<html class="full-height">
<head>
    <meta charset="utf-8">
    <script src="jquery-2.0.2.js"></script>
    <script src="main.js"></script>
</head>
<body>
    <div id="username">Guest</div>

在 main.html 中有一个按钮可以调用 background.js 中的新功能并在 div 中添加用户名：

main.js

$(".menu-new-window").click(function() {

    create_window()

    $("user_name").html("John Doe");
});

基本流程是，我 select 列表中的一个用户 "John" (parent/first window)，一个新的 window 将打开，John将填充在新 window 的头部部分（div id 用户名）。但是在打开一个新的 window 之后，它在父 window 中添加了 John 而不是新的 window。每当我打开一个新的 window 时都会发生这种情况，它总是会更新其父 window.

我刚刚开始开发该应用程序，因此没有太多代码可以显示，我已经显示了一些基本代码，说明我如何尝试使用 multi-windows。

如果我的问题不够清楚，请告诉我。谢谢！

Answer 1

正如 wOxxOm 提到的，当您在文档中执行代码时，会影响该文档。即使只是理论上，您的特定代码如何 知道您指的是哪个 window？

您可能可以使用 4 种广泛的方法，我并不是说它们是详尽无遗的。我也不赘述了。

用 URL
中编码的一些参数打开一个 window
您可以使用查询参数或 URL 片段将（少量）数据传递给新的 window。例如：
```
chrome.app.window.create("main.html#u=" + encodeURIComponent("John Doe"));
```
然后在另一个 window 打开时解码 location.hash。

问题在于：您不能通过这种方式传递太多信息。
使用Messaging。 chrome.runtime.sendMessage 可用于将一些数据广播到应用程序的所有部分。但是，它的问题是确定应用程序的哪一部分应该监听。
使用chrome.storage。这是一个共享存储，您的原始 window 可以在调用新的 window 之前写入，新的 window 可以从中读取。识别 windows 又出现了一些问题，但更容易避免。

如果您从 window 创建的回调中进行访问，则可以直接访问新的 window。

即the contentWindow property of AppWindow.

chrome.app.window.create(
  "main.html",
  opt_options,
  function(appWin) {
    otherWindow = appWin.contentWindow;
    otherWindow.username = "John Doe";
  }
);

// And in the other window
window.onload = function() {
  // You can use `username` here
}

甚至给了as a sample in the docs.

将控制转移到新的 window - chrome 打包应用程序

Transfer control to new window - chrome packaged app

javascript

google-chrome

multi-window

google-chrome-app