这是一个简单的HTML“todo app”,我有一个文本输入,将在页面上显示该文本。每次输入文本并单击按钮时,都会出现一个新的“待办事项”。我希望能够删除待办事项并通过单击文本使其消失。
我让它工作的地方会删除整个但似乎无法让它在创建后删除个别li。
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.7.1.js"></script>
<script>
function myTask()
$('#btnName').click(function(){
var text = $('#inputName').val();
if(text.length){
$('<li />', {html: text}).appendTo('ul.taskList')
}
});
</script>
</head>
<body onload="myTask()">
<div id="container">My Todos</div>
<input type="test" id="inputName" />
<button id="btnName">Click me!</button>
<ul class="taskList"></ul>
<script>
$("ul").click(function () {
$(this).remove();
});
</script>
</body>
</html>
答案 0 :(得分:2)
定位实际的li
$(".tasklist").on("click", "li", function () {
$(this).remove();
});