javascript - 在 Chrome 扩展中使用动态生成的 anchor 标记

Question

我正在动态生成一些 anchor 标记，并使用它们通过它们的 id 重定向到其他页面。我已经通过内联脚本完成了很多次，但不幸的是 chrome 扩展不支持内联脚本。
var profileUid是动态生成的，我每次都将它们作为 anchor 标记的 id
<a id='+profileUid+'>'link</a>所以每个链接都有不同的 id，当我点击这些链接时应该调用以下函数
$(function() {
$('a').click(function() {
console.log(this.id);
alert(this.id);
chrome.tabs.create({url:'https://plus.google.com/'+this.id+'/posts'});
});
要重定向到新页面，它适用于静态元素( anchor 标记)，但不适用于动态生成的元素。这让我发疯，让我寻求一些帮助来离开这里。

Answer 1

当你执行$('a').click(handler);时，它首先找到所有匹配的元素，然后绑定(bind)到它们的事件。因此，它仅适用于调用时已经存在的元素。

所以，当您稍后添加 <a> 时元素到 DOM 中，您需要单独处理它的事件。

function handler() {/* ... */}

// Bind to static elements
$(function() {
  $('a').click(handler);
});

// Create an elemet
var element = $('<a>');
element.attr('id', profileUid);
element.text("Whatever");
element.click(handler);
element.appendTo(parent);