Extension Chrome; ouvrir un lien à partir de popup.html dans un nouvel onglet

Je suis en train de faire une extension Chrome et je l'ai aidé dans ce post ici.

Mon problème maintenant est de savoir comment ouvrir un nouvel onglet de google chrome, qui a comme URL le lien j'ai cliqué dans le popup.html. J'ai essayé de faire comme quelqu'un l'a suggéré dans leurs réponses dans d'autres question similaire, comme la mise en <a>s'attribut target à _blank mais le seul résultat, c'est que chrome n'ouvrez un nouvel onglet, mais dans le nouvel onglet est mon popup.html.

Une idée de comment résoudre ce problème?

Grâce.

InformationsquelleAutor Advicer | 2012-01-18
  1. 60

    Vous devez utiliser le chrome.onglets module pour ouvrir manuellement le lien désiré dans un nouvel onglet. Essayez d'utiliser cette jQuery extrait de code dans votre popup.html:

    $(document).ready(function(){
   $('body').on('click', 'a', function(){
     chrome.tabs.create({url: $(this).attr('href')});
     return false;
   });
});
    • Ne devrait-il pas un attribut de l'-je mettre comme URL 'href'. Bytheway il ne fonctionne pas dans les deux cas. Il m'ouvre un onglet avec cette url: chrome-extension://ceapmkdonphjngfdcjcoahdmkenpbgpn/?action=lire&idnotizia=71189
    • Vous avez raison à propos de 'href', désolé pour ça - j'ai fixé ma réponse. Vous devez fournir url complète dans href si vous souhaitez ouvrir. Actuellement, vous avez des liens de ce type <a href='?action=read&idnotizia=71189'> les changer en pleine Url <a href='http://yoursite.com?action=read&idnotizia=71189'>.
    • Je pensais que c'était un problème avec mon extension. J'ai concaténé le nom de domaine à la chaîne et fonctionne à la perfection.
    • Remarque, cela ne fonctionne que pour les liens qui existent dans le document au moment du chargement, et est également très efficace. Pour attraper TOUS les lien clics efficacement, n'importe quand le lien est apparu, utiliser $('body').on('click', 'a', function ()...
    InformationsquelleAutor Konrad Dzwinel
  2. 35

    Voir mon commentaire https://stackoverflow.com/a/17732609/1340178

    J'ai eu le même problème et c'était mon approche:

    1. Créer l'popup.html avec le lien (et les liens ne fonctionnent pas lors d'un clic comme google Chrome bloquer).
    2. Créer popup.js et le lien de la page: <script src="popup.js" ></script>

    3. Ajoutez le code suivant à 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});
            };
        })();
    }
});

    C'est tout, les liens doivent fonctionner après que.

    • solution sympa, merci.
    • Parfait. Merci.
    • J'utilise le même javascript pour options.html et popup.html ce code résout le problème pour popup.html mais aussi source de problèmes pour options.html lorsqu'il ouvre deux onglets, le même lien (parce que options.html n'a pas besoin de fix), mais je ne veux pas utiliser des fichiers js, avez-vous une idée de comment le résoudre?
    • semble que j'ai trouvé une solution pour vérifier si la page est pop-up ou options: if (chrome.extension.getViews({ type: "popup" }).length > 0) { // execute your code }
    • nous avons également besoin d'-ce que pour Google Chrome et Opera, mais il ne faut pas ajouter ce code dans les extensions Firefox (WebExtensions) cause dans Firefox, il fonctionne très bien sans aucune correction, si vous ajoutez à cela, il va ouvrir deux onglets avec l'extension Firefox
    InformationsquelleAutor lasantha
  3. 20

    Si vous ne souhaitez pas utiliser JQuery, insérez ce dernier dans votre popup.js et il fera toutes vos liens s'ouvrent dans un nouvel onglet lorsque vous cliquez dessus

    N'oubliez pas de prendre les "onglets" de l'autorisation dans le manifeste.json 

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

    Les autres réponses de travail. Pour être complet, une autre façon est de ajoutez simplement target="_blank"

    Ou si vous avez envie de "manuellement" ajouter des liens, voici un moyen (sur la base des autres réponses déjà ici):

    popup.html

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

    popup.js

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

function openIndex() {
 chrome.tabs.create({active: true, url: "http://my_url"});
}
    • whoah ce besoin de plus d'attention.. 🙂
    • plus simple travailler réponse
    InformationsquelleAutor rogerdpack
  5. 0

    J'ai eu le même problème. Regardé comme Konrad solution a fonctionné, mais il a ouvert plusieurs onglets à la fois. Cela s'est produit seulement après la première extension de l'installation. Donc je l'ai changé pour

    if (e.target.classList.contains("a-link")) {
    chrome.tabs.create({url: $(e.target).attr('href')});
    return false;
}

    et tout fonctionne comme prévu.

    InformationsquelleAutor Strabek
  6. 0

    Onglet envoyer l'url à partager blog dans un nouvel onglet:

    //popup.js
chrome.tabs.query({ active: true, currentWindow: true }, function(tabs){        
    var url = tabs[0].url;
    var title = tabs[0].title;
    document.getElementById('linkQZone').onclick = function () {
        var url1 = 'https://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url=' + url + '&title=' + title + '&desc=&summary=&site=';
        chrome.tabs.create({active: true, url: url1});
    };

    document.getElementById('linkQQ').onclick = function () {
        var url1 = 'https://connect.qq.com/widget/shareqq/index.html?url=' + url + '&title=' + title + '&desc=&summary=&site=';
        chrome.tabs.create({active: true, url: url1});
    };
});
    InformationsquelleAutor sonichy