在具有文本输入字段的数组中添加和删除项,可以通过以下步骤实现:
下面是一个示例代码,演示如何在具有文本输入字段的数组中添加和删除项:
// 初始化数组
var items = [];
// 添加项
function addItem() {
var inputField = document.getElementById("inputField");
var value = inputField.value;
// 创建新的数组项
var newItem = {
text: value
};
// 将新的数组项添加到数组中
items.push(newItem);
// 清空文本输入字段
inputField.value = "";
// 更新显示
displayItems();
}
// 删除项
function deleteItem(index) {
// 使用索引从数组中删除项
items.splice(index, 1);
// 更新显示
displayItems();
}
// 更新显示
function displayItems() {
var list = document.getElementById("list");
list.innerHTML = "";
// 遍历数组并显示每个项
for (var i = 0; i < items.length; i++) {
var item = items[i];
// 创建列表项
var listItem = document.createElement("li");
listItem.innerHTML = item.text;
// 创建删除按钮
var deleteButton = document.createElement("button");
deleteButton.innerHTML = "删除";
deleteButton.onclick = (function(index) {
return function() {
deleteItem(index);
};
})(i);
// 将删除按钮添加到列表项中
listItem.appendChild(deleteButton);
// 将列表项添加到列表中
list.appendChild(listItem);
}
}
这个示例代码使用了JavaScript来实现添加和删除项的功能。你可以根据具体的需求进行修改和扩展。
领取专属 10元无门槛券
手把手带您无忧上云