javascript - 在 chrome api 调用之外携带变量

Question

可能重复：
调用 chrome.tabs.query 后，结果不可用

免责声明：我是一个完整的 javascript n00b，要温柔。

popup.js：

var foo = '';
chrome.tabs.query({'active': true, 'windowId': chrome.windows.WINDOW_ID_CURRENT},
   function(tabs){
      foo = tabs[0].url;
   }
);

document.getElementById("bar").innerHTML=foo;

这不起作用，因为 foo 未定义。我知道通过将 document.getElementById 移动到它工作的函数中，但关键是我希望 foo 引用我稍后可以在我的 popup.js 中使用的变量

Answer 1

我从来没有使用过 Chrome api ......但是看起来你的问题是基本的 JavaScript。

您需要在回调中设置 #bar 的 innerHTML：

chrome.tabs.query({'active': true, 'windowId': chrome.windows.WINDOW_ID_CURRENT},
   function(tabs){
      document.getElementById("bar").innerHTML = tabs[0].url;
   }
);

如果您不这样做，以下是您提供的示例代码中发生的情况：

// 1. Create foo.
var foo = '';

// 2. Call the query function on chrome.tabs
chrome.tabs.query({'active': true, 'windowId': chrome.windows.WINDOW_ID_CURRENT},
   function(tabs){
      // 4. Set foo after query is done doing whatever.
      foo = tabs[0].url;
   }
);

// 3. Set the html of the element with id="bar" to what's in foo (which is empty right now)
document.getElementById("bar").innerHTML=foo;

编辑：我假设 chrome.tabs.query 是一个异步调用，这就是它有回调的原因。如果是同步的，请忽略我的回答。