user2845758
user2845758

Reputation: 21

how to execute javascript in chrome browser extension

i am trying to make an extension for google chrome in which i need to execute a simple javascript to open url in chrome extension i know that anchor tag can do that but i wanted some other functionality to be added in js.

simple pop.html file from which javascript will be executed is :

<html>
<body>
<form>
<div id="search_panel">

<input type="text" id="box" name="txt" required placeholder="Search anything"/> <input type="submit" id="stu_submit" onclick="hey();" name="stu_post" value="Search"/>
<div> <a href="http//s.com" target="_blank" id="stu_links" >s.com</a> <a href="#" id="stu_links">news</a> <a href="#" id="stu_links">hey</a> <a href="#" id="stu_links">Sign In</a> </div>
</div>
<script>
    function hey()
    {
    window.open('http://www.google.com');
    }
  </script>
</form>
</body>
</html>

and the manifest file is :

{
  "name": "Chrome Extension for s.com",
  "version": "1.0",
  "manifest_version": 2,
  "description": "Google Chrome Extension for s.com.",
  "browser_action": 
  {
    "default_icon": "img/icon.png",
    "default_menu": "FirstMenu",
    "default_popup": "popup.html"
  },

   "chrome_url_overrides" : {
    "newtab": "s.html"
  },

  "permissions": [
    "http://api.flickr.com/"
  ]
}

please help and tell how to execute js in popup.html

Upvotes: 1

Views: 3034

Answers (1)

Soman Dubey
Soman Dubey

Reputation: 3906

This might help you: Run Javascript in Chrome Extension -> Basic?

copied here for quick reference:

According to chrome extension documentation,

Inline JavaScript will not be executed. This restriction bans both inline <script> blocks and inline event handlers (e.g. <button onclick="...">).

Read: http://developer.chrome.com/extensions/contentSecurityPolicy.html#JSExecution

Use in popup.js as

document.addEventListener('DOMContentLoaded', function () {
      document.querySelector('button').addEventListener('click', main);      
});
function main() {
    var source = document.getElementById('source').value;
    document.getElementById("result").innerHTML = source;
}

Upvotes: 1

Related Questions