Chrome extension; open a link from popup.html in a new tab

If you don't want to use JQuery, insert this into your popup.js and it will make all your links open in a new tab when clicked

Remember to declarer the "tabs" permission in the manifest.json

window.addEventListener('click',function(e){
  if(e.target.href!==undefined){
    chrome.tabs.create({url:e.target.href})
  }
})

See my comment https://stackoverflow.com/a/17732609/1340178


I had the same issue and this was my approach:

  1. Create the popup.html with link (and the links are not working when clicked as Chrome block them).
  2. Create popup.js and link it in the page: <script src="popup.js" ></script>
  3. Add the following code to popup.js:

    document.addEventListener('DOMContentLoaded', function () {
        var links = document.getElementsByTagName("a");
        for (var i = 0; i < links.length; i++) {
            (function () {
                var ln = links[i];
                var location = ln.href;
                ln.onclick = function () {
                    chrome.tabs.create({active: true, url: location});
                };
            })();
        }
    });
    

That's all, links should work after that.


The other answers work. For completeness, another way is to just add target="_blank"

Or if you have want to "manually" add particular links, here's a way (based on the other answers already here):

popup.html

<a id="index_link">My text</a>.

popup.js

document.addEventListener('DOMContentLoaded', () => {
   var y = document.getElementById("index_link");
   y.addEventListener("click", openIndex);
});

function openIndex() {
   chrome.tabs.create({active: true, url: "http://my_url"});
}

You should use chrome.tabs module to manually open the desired link in a new tab. Try using this jQuery snippet in your popup.html:

$(document).ready(function(){
   $('body').on('click', 'a', function(){
     chrome.tabs.create({url: $(this).attr('href')});
     return false;
   });
});