点击扩展图标时打开popup.html [英] Open popup.html when click in extension icon

问题描述

我今天开始学习javascript，并试图做一个谷歌浏览器扩展。当我点击扩展图标时，我想打开一个带有主HTML（popup.html）的新选项卡。

我遇到了麻烦，因为我改变了它这么多，并不断弹出一百个新的标签。

这是我的清单：

 < 
manifest_version：2，
name：Youtube Autoplay，
version：0.1，
description：自动播放从我的浏览器中选择的YouTube视频，
browser_action：{
default_title：Youtube Autoplay，
default_icon：icons / icon16.png，
default_popup：popup.html
}，
权限：[
标签
]，
背景：{
scripts：[popup.js] 
} 
} 
  

这里是我用来打开新标签的函数

  chrome.tabs.create（{'url'：chrome。 extension.getURL（'popup.html'）}，函数（tab）{
 //打开tab。
}）; 
  

我在这里发现了一些旧的awnsers，尝试了一些，但仍然遇到了问题。 $ b

解决方案

添加 onClicked 关于浏览器操作的监听器（扩展图标）：
$ b background.js

'pre> chrome.browserAction.onClicked.addListener（functiont（制表符）{​​
chrome.tabs.create（{ 'URL'：chrome.extension.getURL（'弹出。 （'b
}）;
}）


$ b

注意：

onClicked侦听器只会在扩展程序没有弹出窗口时运行。因此，从 manifest.json 中删除​​default_popup：popup.html。您还需要在web_accessible_resources web_accessible_resources下添加popup.html：[popup.html]

I started studying javascript today and I'm trying to do a google chrome extension. I want to open a new tab with the main html (popup.html) when I click in the extension icon.

I'm having trouble with this because I changed it so much and keep poping up a hundred of new tabs.

Here's my manifest:

{
    "manifest_version": 2,
    "name": "Youtube Autoplay",
    "version": "0.1",
    "description": "Autoplay selected YouTube videos from my browser",
    "browser_action":{
        "default_title": "Youtube Autoplay",
        "default_icon": "icons/icon16.png",
        "default_popup": "popup.html"
    },
    "permissions": [
      "tabs"
    ],
    "background":{
      "scripts": ["popup.js"]
    }
}

Here's the function that I'm using to open new tab

chrome.tabs.create({'url': chrome.extension.getURL('popup.html')}, function(tab) {
  // Tab opened.
});

I found some old awnsers here, tried some and still getting the problem.

解决方案

Add an onClicked listener on browser action(extension icon):

background.js

chrome.browserAction.onClicked.addListener(functiont(tab){
  chrome.tabs.create({'url': chrome.extension.getURL('popup.html')},function(tab) {
  // Tab opened. 
 });
})

NOTE :

onClicked listener will only run when extension does not have a popup. So remove "default_popup": "popup.html" from manifest.json. Also you need to add popup.html under web_accessible_resources "web_accessible_resources": ["popup.html"]

这篇关于点击扩展图标时打开popup.html的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！