web-dev-qa-db-ja.com

Chrome拡張機能;新しいタブでpopup.htmlからリンクを開く

Chrome拡張機能を使用していますが、この投稿で助けられました here 。

私の問題は、chromeの新しいタブを開く方法です。このタブには、popup.html。他の似たような質問の回答で誰かが提案したように、<a>の属性targetから_blankしかし、唯一の結果はchromeは新しいタブを開きますが、新しいタブには私のpopup.htmlがあります。

これを解決する方法はありますか？

ありがとう。

google-chromegoogle-chrome-extension
40
Advicer

chrome.tabs moduleを使用して、新しいタブで目的のリンクを手動で開く必要があります。 popup.htmlでこのjQueryスニペットを使用してみてください。

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

私のコメントを参照してください https://stackoverflow.com/a/17732609/1340178

私は同じ問題を抱えており、これが私のアプローチでした：

  1. リンク付きのpopup.htmlを作成します（Chromeブロックする）としてリンクをクリックしても機能しません）。
  2. Popup.jsを作成し、ページにリンクします：<script src="popup.js" ></script>

  3. 次のコードを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});
            };
        })();
    }
});

それだけです、その後リンクは機能するはずです。

36
lasantha

JQueryを使用したくない場合は、これをpopup.jsに挿入すると、クリックするとすべてのリンクが新しいタブで開かれます

Manifest.jsonで「タブ」権限を宣言することを忘れないでください

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

他の答えは動作します。完全を期すために、別の方法は ちょうど追加target="_blank"

または、特定のリンクを「手動で」追加したい場合は、次の方法があります（すでに他の回答に基づいています）。

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"});
}
7
rogerdpack

同じ問題がありました。 Konradのソリューションは機能するように見えましたが、一度に複数のタブを開きました。これは、最初の拡張機能のインストール後にのみ発生しました。だから私はそれを

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

そして、すべてが期待どおりに機能しています。

0
Strabek

タブのURLを送信して、新しいタブでブログを共有します。

// 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});
    };
});
0
sonichy