简介:任务是使用 jQuery 预先添加列表项。可以使用 jQuery 从列表中动态添加和删除项目。这可以通过使用事件处理程序来监听按钮点击来完成。我们将通过一个例子来理解这一点。
例子:
List
-
说明:这里有一个列表(id = “list”),带有一个文本框和一个关闭按钮(class = “close”)。该按钮用于从列表中删除项目。在列表的末尾,我们有一个添加按钮(class = “add”),用于在开头添加一个新的列表项。
$(".add").click(function () {
$("#list").prepend('
');
});
.click() 被添加到“添加”按钮以监听鼠标点击。单击按钮时,使用 prepend()函数添加一个带有文本框和关闭按钮(具有相同的“关闭”类)的列表项。我们使用 prepend函数是因为我们想在列表的开头添加一个项目。为了在最后添加一个项目,将使用 append()。
$(document).on("click", "button.close", function () {
$(this).parent().remove();
});
这里我们使用 on()函数来监听鼠标点击,因为 click() 不适用于动态生成的元素。现在它也适用于新添加的“关闭”按钮。当具有后代类“close”的按钮被点击时,它的父类(
- 输出:
- 原单
-
点击添加按钮后