Question

对jQuery来说很新，如果在这一点上欺骗，我甚至不确定我是否使用了正确的措辞。

我需要根据ListBox的单击事件将一个li项添加到ul（用户选择文本，并添加一个带有所选文本的新li）。我需要在li项目上添加图标，标签和输入。图标必须是“删除”图标。

如何通过jQuery连接函数以删除新添加的li项目？

这是我尝试过的;

        $(function() {
        function addSelectedWordCriteria() {
            var selectedWord = $("#wsWords").val();
            $("#wsCriteriaList").append("<li><a href='#' class='wsCriteriaRemove'><span class='ui-icon ui-icon-circle-close'/></a><em class='wsFilteredWord'>" + selectedWord + "</em><input type='textbox' maxlength='200' class='wsFilteredWords'/></li>");
            $("#wsCriteriaList a:last").bind("click", "removeSelectedWordCriteria");
        };

        function removeSelectedWordCriteria() {
            $("#wsCriteriaList").selected().remove();
        }

    })

<%= Html.ListBox("wsWords", ViewData["Words"] as IEnumerable<SelectListItem>) %>    

<ul id="wsCriteriaList">    
</ul>

感谢您的任何建议。

Answer 1

对于您的直接问题，由于click事件为您提供了发送事件的元素的引用，您可以使用它快速确定应删除的内容：

    function removeSelectedWordCriteria() {
        $(this).parent().remove();
    }

我可能会对此代码进行更改：

正如ScottE所指出的，这可能是使用新的实时功能的好地方。在addSelectedWordCriteria方法之外，您应该能够输入：
```
$("#wsCriteriaList a").live("click", "removeSelectedWordCriteria");
```
即使添加了相同的事件，这也会将所有标签注册。
说到标签，我不确定你是否真的需要你的标签。您真正想要的是能够单击包含删除图像的范围。由于您实际上并未使用链接，我个人会将锚标记全部取出并将click事件直接放在span标记上。然后，您可以为上面的实时函数提供一个类。

如果您还有其他问题，请与我们联系。

Answer 2

你没有正确使用bind方法 - 你的方法调用用引号括起来。

http://docs.jquery.com/Events/bind#typedatafn

Answer 3

问题在于您是否使用bind("click", "removeSelectedWordCriteria")使用bind函数的 data 参数绑定了click事件。

当用户点击按钮时，不会发生任何事情，因为没有定义回调函数。

您应该直接传递函数引用或创建一个匿名函数作为处理程序：

$("#wsCriteriaList a").bind('click', removeSelectedWordCriteria);

或者

$("#wsCriteriaList a").click(removeSelectedWordCriteria);

或

$("#wsCriteriaList a").click(function(){removeSelectedWordCriteria();});

jQuery添加<li>项目并单击事件</li>

3 个答案: