javascript - jquery:动态地将li项附加到ul然后添加click，但click贯穿每个li

Question

所以我在学习时可能会遇到这个错误，但我似乎无法弄清楚我在这里做错了什么(可能是简单的错误，但我遇到了麻烦)。因此，我尝试在标记内单击按钮，允许从对话框中进行选择，对话框上的提交按钮包括对自定义函数的调用，该函数执行一些逻辑，然后将字符串附加到类似的内容:

buildListElementItem += "<li>something</li>";
$("#my-list").append(buildListElementItem);

然后绑定(bind)单击，因为我需要每个列表项代表选择面板类型的事物

$("#my-list li").bind('click', function () {
   //processing stuff
});

一切正常，但如果我向此列表添加多个项目(一个接一个)，并且您单击单个项目，它会滚动浏览每个项目，这让我很困惑，因为没有每个项目，我认为这应该只添加它到单个项目......

所以这个函数/等等还有很多，但我认为我在这里的方法是错误的？？

我尝试修改选择器，使其类似于我在 li 的字符串中添加的类，我尝试使用 .on、.live、.delegate 或任何我能找到的东西来代替绑定(bind)单击。

也许这是尝试执行此操作的简单方法类型错误，但我非常感谢对此的任何帮助、建议等。

编辑:只是添加更多内容以进行澄清

对话框允许用户从选择/下拉列表中选择项目，按钮单击(jquery ui)具有调用下面的想法将项目添加到列表元素(用作选择面板)的功能。因此，他们可以填充面板上所需的项目，然后单击每个项目来填充数据并将其与该项目关联。

function addNewListItem(passedType)
{
    var buildListElementItem = "<li>" + passedType + "</li>";
    $("#my-list").append(buildListElementItem);
    $("#my-list li").bind('click', function () {
       otherStuff();
});

如果我执行上述操作，我猜测这会导致每个元素一遍又一遍地绑定(bind)？不确定，但这有一个异常(exception)，即当我单击该面板上的单个 li 项目时，它会处理面板上的所有 li 项目(otherStuff 函数)。所以我认为从这些例子中我开始理解这个问题或者为什么这行不通，但是我将如何处理我想要做的事情呢？一直很欣赏伙计们!}

Answer 1

当你说“没有each”时，你忽略了 $("#my-list li") 是一个 jQuery 选择器，即它返回与表达式匹配的所有元素:在这种情况下，#my-list 的子树中的所有 li 项。因此，当您调用bind时，它将绑定(bind)到已添加到元素中的每个li项。

您正在寻找的是这样的东西:

buildListElementItem = $("<li>something</li>"); //constructs a jquery object you can bind to
buildListElementItem.bind('click', function () {
   //processing stuff
});
$("my-list").append(buildListElementItem);

这样，您可以在添加元素之前进行绑定(bind)。