javascript - 如何将事件绑定(bind)到动态创建的 JQuery DOM 元素

Question

我在尝试创建的插件中引用对象时遇到问题。

该插件与 div 容器关联。

当 dom 准备好时，它会加载启动默认值 - 使用它知道的 id 和一个无序列表创建自己的 div。我可以添加列表项，并且它们可以使用 $this.append(..) 正常工作。不过，我想添加一个功能，单击单个列表项即可执行某些操作......现在警报就足够了。

通常我能够做到:

$("#myId").click(function(){...

我如何将这样的功能添加到插件中？

我希望由插件本身设置该操作，因此单击由插件创建的列表项已经附加到我已写入 jquery 插件的某些功能。

Answer 1

根据您的评论，您可以将新选项卡存储在变量中:

var newTab = $("<li id='tab#" + o.tabCount + "' myTabPane='" + 
    o.tabId + o.tabCount + "' class='tab'><h3>Tab " + o.tabCount
    + "</h3></li>");
$('#' + o.tabListId).append(newTab);
newTab.click(function() {
    var paneId = '#' + $(this).attr('myTabPane');
    $(paneId).siblings().hide();
    $(paneId).show();
});

链接到working example at jsfiddle .

顺便说一句，您的原始脚本将第二个 ' 放在了错误的位置:

$("<li id='tab#'" + o.tabCount + " class='tab'><h3>Tab "
              ^^^