如何将 URL 添加到 Chrome 浏览器扩展？

Question

我已经为 Chrome 创建了一个 浏览器扩展。我已将 HTML Table 作为 Popup 添加到 browser_action.html 中，如下所示。

我想要的是，当我单击 Table 单元格 时，它 应该将我带到 link。单击不同的单元格时会出现不同的 link。

这是我的代码的一部分：

<tr>
<td class="tg-z3w6 hvr-underline-from-center"><a href="http://ew/Environment/Detail?envid=2715"></a>TEST</td>
<td class="tg-ges6">2715</td>
</tr>

但是没用。知道为什么吗？或此问题的解决方法？

Answer 1

TEST 应该在 <a> 和 </a> 之间。

Answer 2

在您的 popup.html 中假设您使用的是 jquery-

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

Answer 3

这是我自己的问题的解决方案。 在页面中创建 popup.js 和 link：

<script src="popup.js" ></script>

将以下代码添加到 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});
            };
        })();
    }
});

就是这样，links 之后应该可以工作了。

Answer 4

非常简单，您只需将 target="#" 添加到您的 a 标签

喜欢

<td class="tg-z3w6 hvr-underline-from-center"><a href="http://ew/Environment/Detail?envid=2715" target="#" ></a>TEST</td>