简体   繁体   English

Chrome扩展程序如何响应按钮在页面中的点击?

[英]How can a Chrome extension respond to a button click in a page?

I'm making a first attempt at writing a Chrome extension and I want it to respond to a button click which resembles the facebook like button, G+ button, etc. This means that I'd like the extension to work on any page, but only respond to a button with a particular ID or something, which seems tricky with the "permission" and/or "matches" item of the JSON manifest. 我正在尝试编写Chrome扩展程序,我希望它能够响应类似于按钮,G +按钮等Facebook按钮的单击。这意味着我希望扩展程序可以在任何页面上使用,但是仅响应具有特定ID或其他内容的按钮,这对于JSON清单的“ permission”和/或“ matches”项似乎很棘手。

Since I'm unfamiliar with extensions, should I have the button have its own javascript function which calls/activates the extension somehow, or should I have the extension have an event listener (would this be in a content script?) which listens for a particular button click event? 由于我不熟悉扩展程序,因此我应该让按钮具有自己的javascript函数以某种方式调用/激活扩展程序,还是应该让该扩展程序具有一个事件侦听器(是否在内容脚本中)?特定的按钮单击事件?

Note: I took a look at this question but the extension in that case was for a specific web page, so I'm not convinced that the answer will work for me. 注意:我看了这个问题,但是在这种情况下,扩展名是针对特定网页的,因此我不相信答案对我有用。

First thing you want is that your extension should work on all pages, so include your content script in manifest as follows : 您需要做的第一件事是扩展程序应该在所有页面上都可以使用,因此在清单中包括您的内容脚本,如下所示:

"content_scripts": [
    {
        "matches": [
            "<all_urls>"
        ],
        "js": [
            "jquery.js",
            "myscript.js"
        ]
    }

This will inject myscript.js in every page. 这将在每个页面中注入myscript.js。 Now just check if your desired button is present or not. 现在,只需检查您所需的按钮是否存在。 eg : 例如:

if(document.getElementById('gplus') != null) {
   // Add your implementation.
   var g = document.getElementById('gplus');
   g.click = funct;
}

Now define function funct() according to yourself. 现在根据自己定义函数funct()。

try using content scripts. 尝试使用内容脚本。 They act like they are part of the page. 它们的行为就像是页面的一部分。 if i had a document.getelementbyid("#hi").onclick=function(){}; 如果我有一个document.getelementbyid("#hi").onclick=function(){}; and someone clicked a button with an id of "hi" inside the current page, the event would fire. 如果有人在当前页面中单击ID为“ hi”的按钮,则会触发该事件。

Read more at: https://developer.chrome.com/extensions/content_scripts 有关更多信息, 访问: https : //developer.chrome.com/extensions/content_scripts

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 Chrome扩展程序弹出窗口:运行JavaScript,响应按钮单击 - Chrome extension popup: running JavaScript, respond to button click 如何在页面加载时自动点击Chrome扩展程序? - How can I make a Chrome extension automatically click a button when a page loads? 如何单击 Chrome 扩展程序中的按钮 - How to click on a button in Chrome Extension 如何以编程方式单击带有Chrome扩展程序的Google文档中的按钮? - How can I programmatically click a button in Google Docs with a Chrome Extension? 如何从点击按钮运行 chrome 扩展程序? - How to run a chrome extension from a click button? Chrome 扩展 - 使用热键单击页面上的元素(按钮) - Chrome Extension - click on element (button) on the page using hotkey 从 web 页面按钮点击调用 Chrome 扩展中的 JavaScript 方法 - Call JavaScript method in Chrome extension from web page button click 当按钮单击 CHROME EXTENSION 时,如何从内容脚本打开选项页面? - How to open Options page from content script when button click CHROME EXTENSION? Chrome 扩展程序:如何向网站上的页面添加按钮并为其添加点击处理程序? - Chrome extension: How to add a button to a page on a web site and add a click handler to it? Google扩展程序如何单击网页上的按钮? - Google extension how to click a button on the web page?
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM