该网站的目的是存储和订购书籍标题，我需要这样做，以便用户可以删除他们输入到数组中的书籍。我对 Javascript 还很陌生，但有一点 Java 和 C# 经验。
在这个问题上有点卡住了。正在阅读一些有关使用拼接和删除从代码中的数组中删除元素的内容。但是当我为它创建一个函数时，它会删除数组中的所有内容，而不仅仅是文本框输入字符串。
出于我的评估目的，需要在不使用第三方库的情况下完成。
我知道这可能不是存储数据的最佳方式，因为它会在刷新或关闭页面时清除。
HTML:
<!DOCTYPE html>
<html>
<body>
<h1> Prototype Book Storage and Display </h1>
<form id = "formWrapper">
Search<br>
<input id="myTextBox" type="text" name="search">
<br>
<input onClick="submitData()" type="button" value="Submit Book">
<input onClick="printBooks()" type="button" value="Find Book">
<input onClick="deleteData()" type="button" value = "Delete Book">
<p id = "booktitle"></p>
</form>
</body>
</html>
Javascript:
var myFormData = []; //declare an array
var value1;
//Prints My Books to a list
function printBooks() {
clearBook();
alert(myFormData);
document.getElementById('booktitle').innerHTML = myFormData;
}
//Submits input to array
function submitData()
{
value1 = document.getElementById("myTextBox").value;
myFormData.push(value1);
alert(myFormData);
clearField();
}
//Deletes data from the array
function deleteData()
{
deleteValue = document.getElementById("myTextBox").value;
myFormData.splice(deleteValue);
alert(deleteValue + " " + "Deleting your book");
}
//clears textbox field
function clearField()
{
var txt2 = document.getElementById("myTextBox");
txt2.value = "";
}
//Refreshes book object model
function clearBook()
{
var txt3 = document.getElementById("booktitle");
txt3.value="";
}
最佳答案
问题出在
myFormData.splice(deleteValue);
splice()需要一个起始索引，您正在传递一个字符串值。请参阅How do I remove a particular element from an array in JavaScript?关于如何使用它。
在你的情况下是
// get the index of the value in the array or -1 if it does not exist
var index = myFormData.indexOf(deleteValue);
// only try removing it, if it exists in the array
if (index !== -1) {
myFormData.splice(index, 1);
}
关于Javascript/HTML 如何通过 HTML 输入/文本框动态删除 javascript 数组的元素，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/47047358/