Javascript 提交表单后使用jQuery追加表不显示

我有一个HTML，其中有一个表格，可以用表格添加书籍信息

我还有一个js文件，我在其中使用jQuery（只是为了练习），我为创建的每个Book对象创建了一个Book构造函数。每本书都存储在一个数组（库）中，每个元素都是HTML表中的一行。问题是，每当我在提交表单后尝试在表中附加一个新的book对象时，我都会看到新行1秒钟，然后就没有显示。可能是DOM加载问题，但我找不到方法

以下是我的HTML和JavaScript：

let library=[]；
让书；
功能书（标题、作者、页数、阅读）{
这个.title=title；
this.author=作者；
这个。页数=页数；
this.read=read；
}
函数addBook（标题、作者、页数、已读）{
let book=新书（书名、作者、页数、阅读次数）；
图书馆。推（书）；
}
addBook（“霍比特人1”，“托尔金”，130，“阅读”）；
$（文档）.ready（函数（）{
//显示表单以添加新书
$（#newBook”）。在（“单击”，函数（）上{
$（“表格”）。向下滑动（500）；
})
$（“#addBook”）。关于（“提交”，函数（）{
设title=$（“#title”）.val（）；
让author=$（“#author”）.val（）；
设页数=$（“#页数”）.val（）；
让read=$（“#read”）.val（）；
addBook（标题、作者、页数、阅读）；
})
//删除行
$（文档）。在（“单击”，“删除”，函数（）上）{
$（this）.closest（'tr'）.remove（）；
library.splice（library.findIndex（x=>x.title==$（this.attr（'class'）），1）；
});
函数showLibrary（）
{
library.forEach（函数（项、索引）{
$（“#books tbody”）。追加（“+item.title+”+item.author+“+item.number\u页数+”+item.read+“Delete”）；
})
}
showLibrary（）；
});

无论什么
书
TitleAuthorPagesRead
新书
标题：



作者：



页数：



你读过这本书吗？：

代码中的问题：

必须防止表单提交和刷新页面。为此，在onsubmit上使用
返回false
。（这是提交后空白页的原因）：


添加书籍后，必须调用showLibrary（）才能使其显示在表中：
$（“#addBook”）。关于（“提交”，函数（）{
//...
//...
//添加图书后重新加载库
showLibrary（）；
})

必须先清除表
t正文
，然后才能重新为库排序：
函数showLibrary（）
{
//在渲染库之前清除tbody：
$（“#图书正文”）.html（“”）；
//...
//...
}

这是您的原始代码，包括以下三个更新：


let library=[]；
让书；
功能书（标题、作者、页数、阅读）{
这个.title=title；
this.author=作者；
这个。页数=页数；
this.read=read；
}
函数addBook（标题、作者、页数、已读）{
let book=新书（书名、作者、页数、阅读次数）；
图书馆。推（书）；
}
addBook（“霍比特人1”，“托尔金”，130，“阅读”）；
$（文档）.ready（函数（）{
//显示表单以添加新书
$（#newBook”）。在（“单击”，函数（）上{
$（“表格”）。向下滑动（500）；
})
$（“#addBook”）。关于（“提交”，函数（）{
设title=$（“#title”）.val（）；
让author=$（“#author”）.val（）；
设页数=$（“#页数”）.val（）；
让read=$（“#read”）.val（）；
addBook（标题、作者、页数、阅读）；
//添加图书后重新加载库
showLibrary（）；
})
//删除行
$（文档）。在（“单击”，“删除”，函数（）上）{
$（this）.closest（'tr'）.remove（）；
library.splice（library.findIndex（x=>x.title==$（this.attr（'class'）），1）；
});
函数showLibrary（）
{
//在渲染库之前清除tbody：
$（“#图书正文”）.html（“”）；
library.forEach（函数（项、索引）{
$（“#books tbody”）。追加（“+item.title+”+item.author+“+item.number\u页数+”+item.read+“Delete”）；
})
}
showLibrary（）；
});

无论什么
书
TitleAuthorPagesRead
新书
标题：



作者：



页数：



你读过这本书吗？：