【问题标题】:How to show a pop up in chrome extension?如何在 chrome 扩展中显示弹出窗口?
【发布时间】:2013-12-11 04:39:31
【问题描述】:

我需要在 chrome 扩展中显示一个弹出窗口。目前,当点击扩展图标时,弹出窗口会显示在一个新窗口中。

我需要的是,当我单击扩展程序时,应该会在扩展程序图标下方看到一个弹出窗口。就像this 一样(请检查此链接中的弹出窗口)。

我的弹出窗口(userinfo.html)要求使用用户名和密码登录。当用户输入用户名和密码并登录时,弹出窗口应该关闭,当用户再次点击扩展图标时,它应该导航到一个网站。我怎样才能做到这一点? 这是我的背景.js

chrome.browserAction.onClicked.addListener(function(tab) {
 if(!localStorage.username){
   chrome.browserAction.setPopup({
    popup: "userinfo.html"
   });
 }
 else
   //navigate to website
});

以这种方式,我显示我的弹出窗口。当用户在安装后第一次单击该图标时,会出现弹出窗口。否则,它会导航到一个网站。现在我的问题是,当我只在图标上单击两次时,就会出现弹出窗口。第二个问题是,在我输入用户名和密码并单击登录后,弹出窗口关闭,这很好。当我再次单击图标时,它实际上应该导航到该网站,但在我的代码中它再次显示弹出窗口。当我重新加载扩展程序时,它可以正常工作。为什么会这样?请帮我。 有一个名为 userinfo.html 的文件,它应该显示为弹出窗口。我怎样才能做到这一点?请帮帮我。

【问题讨论】:

  • 顺便问一下为什么你的browser_action定义了两次?
  • 当我定义了两次时,我得到了我想要的这就是为什么
  • 请不要一直更改问题本身。回答了原始问题的人会无缘无故看起来像傻瓜。

标签: google-chrome-extension popupwindow


【解决方案1】:

在浏览器操作中,您应该包含 default_popup 值,该值指向要呈现为弹出窗口的 HTML 文件。在您的情况下,它是 userinfo.html。

"browser_action": 
     {
   "default_icon": "icon.png",
   "default_popup": "popup.html"
    }

更多信息在这里:https://developer.chrome.com/docs/extensions/reference/browserAction/

【讨论】:

  • 我已经放了你的代码,但我需要的是,当用户第一次点击扩展图标时,他应该看到弹出窗口询问用户名和密码。当他输入用户名时和密码并点击登录,弹出窗口应该关闭。下次当他点击图标时,它应该导航到一个网站。我该怎么做?请帮助我
  • 您应该在我在答案中提到的页面上查看 setPopup 方法和 chrome.browserAction.onClicked.addListener 。在弹出窗口中完成登录后,从 browserAction 中删除弹出窗口,并将侦听器保留在代码中,该代码将在您的网站上打开一个新选项卡。
  • 是的,我确实在尝试设置弹出方法。但是发生的情况是,即使用户登录,然后再次单击扩展图标,弹出窗口也会再次显示。一旦他进入他的弹出窗口上的名称和密码,然后单击登录。然后弹出窗口应该不再显示
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2015-06-22
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多