用jQuery删除动态添加的LI列表项目

我试图动态地将列表项目添加到列表中，然后通过单击该项目将其删除。移除事件似乎从未触发。但是，如果我在静态列表上使用相同的代码，它工作正常。我见过类似的解决方案，但他们不工作。用jQuery删除动态添加的LI列表项目

<input id="status" type="text" placeholder="Status (tab or enter)"> 

<br/> 
Dynamic List: 
<ul id="statusList"></ul> 


$('#status').keydown(function (e) { 
    if (e.which == 9 || e.which == 13) { 
     $('#statusList').html($('#statusList').html() + formatNewStatus(this.value)); 
     this.value = ""; 
     this.focus(); 
     e.preventDefault(); 
    } 
}); 

$(function() { 
    $('#statusList li').click(function() { 
     alert('dynamicList'); 
     $(this).remove(); 
    }) 
});

来源

2014-01-09 Papa Burgundy

你必须使用委托与（） –

这是因为click()功能只有结合，在它被调用的时候存在的DOM元素。

live()是旧技术，但不推荐使用，在未来的版本中不会受到支持。

你需要使用什么是on()

$(function() { 
    $('#statusList').on('click', 'li', function() { 
     alert('dynamicList'); 
     $(this).remove(); 
    }); 
});

来源

2014-01-09 17:00:21

'live（）'在当前版本中甚至不支持 - 它在jQuery 1.9中被删除。为什么你甚至会提到它，因为这个问题从来没有问过这个问题？ – Barmar

所有准确的信息都很有帮助，特别是对于像我这样的人来说，jQuery的进出。我没有意识到on（）取代了live（），因为我没有做很多jquery。我实际上试图在某个时候使用live（）。谢谢（你的）信息。 –

谢谢这个我需要的！ – user1781367

click的功能仅结合到该存在时，它被称为元素。改为使用on()。

上（）

附加的事件处理函数的一个或多个事件的选择的元素。

http://api.jquery.com/on/

来源

2014-01-09 16:58:38

'活（）'在弃用jQuery 1.7，在1.9中删除。你的意思是on（）'。 – Barmar

活死了... –

好抓，更新。我仍在使用旧的jQuery代码库。更新了答案。 –

使用上http://api.jquery.com/on/

$(function() { 
    $('#statusList').on("click", "li", function() { 
     alert('dynamicList'); 
     $(this).remove(); 
    }) 
});

FIDDLE

来源

2014-01-09 17:04:01 Merlin

也正确。感谢您使用小提琴。 –

不客气！ – Merlin

用jQuery删除动态添加的LI列表项目

回答

相关问题