Executing Chrome extension onclick instead of page load - google-chrome-extension

Question

I created a Chrome extension that works as expected except that it only executes when I load a page that matches the conditions in the manifest. I have tried for hours to make it execute by clicking on the extension icon to no avail.
The closest I have been able to what I want is that I have been able to make the extension icon click to run the code, but then it does not run it on the loaded page. It runs it on the extension's space instead of the page DOM.
In the current state my code only runs when a page in the specified domain opens. I want to run it only when it matches that rule, but only when I click the extension icon.
Here is my code:
manifest.json
{
"name": "Get Response URL",
"version": "1.0",
"manifest_version": 2,
"browser_action": {
"default_icon": "mkto_icon.png",
"name": "Click to get URL"
},
"content_scripts": [{
"js": ["contentscript.js"],
"matches": ["http://mydomain.com/*"]
}]
}
contentscript.js
if (document.getElementsByName("returnURL")){
alert("\nThe Response URL on this form is:\n\n" + document.getElementsByName("returnURL")[0].value);
}

Answer 1

As i see you want to run code when
User has clicked on Browser Action ICON and
URL pattern is a match
If so, you have use
Background pages in conjunction with Tabs API.
Demonstration
This is a sample demonstration of your use case and you can put all your code and assign permissions for all match URL(s).
manifest.json
Registered Background Page, Browser Action and Permissions for Target Pages.
{
"name": "Get Response URL",
"version": "1.0",
"manifest_version": 2,
"browser_action": {
"name": "Click to get URL"
},
"background":{
"scripts":["background.js"]
},
"permissions":["https://www.google.co.in/*"] //Put All your URL here
}
background.js
Put all Your Target Matching URL in a series of if conditions here
chrome.browserAction.onClicked.addListener(function (tab) { //Fired when User Clicks ICON
if (tab.url.indexOf("https://www.google.co.in/") != -1) { // Inspect whether the place where user clicked matches with our list of URL
chrome.tabs.executeScript(tab.id, {
"file": "contentscript.js"
}, function () { // Execute your code
console.log("Script Executed .. "); // Notification on Completion
});
}
});
contentscript.js
alert("Code Executed ... ");
Output
When you browse to https://www.google.co.in/ and after click of browser action you see Alert in the page.
References
Tabs API
Background Pages

Answer 2

use browserAction API ,see here
the onClick events may help you. also see these exsamples from google :