我正在嘗試建立一個(gè)圖書館，用戶可以在其中編寫信息和書籍并將其添加到圖書館。我創(chuàng)建了一個(gè)模式表單，用戶可以在其中編寫信息并提交。這是模態(tài)html<form class="modal__container">    <div class="modal">        <div class="modal__content">            <label for="">Title:</label>            <input type="text" id="title">         </div>        <div class="modal__content">            <label for="">Author:</label>            <input type="text" id="author">        </div>        <div class="modal__content">            <label for="">Pages:</label>            <input type="number" id="pages">        </div>        <label for="">Have you read it?</label>        <div>            <label for="yes">Yes</label>            <input type="radio" name ="read" value="yes">            <label for="no">No</label>            <input type="radio" name ="read" value="no">        </div>                <button class="add__book">Add</button>        <button class="cancel">Cancel</button>    </div></form>這是單擊取消按鈕時(shí)關(guān)閉模式的功能function toggle() {    addBtn.addEventListener("click", () => {        modal.style.display = "block";        const cancel = document.querySelector(".cancel");        cancel.addEventListener("click", () => {            modal.style.display = "none";        })    })}toggle();這里我有構(gòu)造函數(shù)和數(shù)組來存儲(chǔ)書籍let myLibrary = [];function Book(title, author, pages) {    this.title = title,    this.author = author,    this.pages = pages}現(xiàn)在我想創(chuàng)建一個(gè)提交新書的函數(shù)submitBook.addEventListener("click", addBookToLibrary);function addBookToLibrary() {   let bookTitle = modalTitle.value;   let bookAuthor = modalAuthor.value;   let bookPages = modalPages.value;   let book = new Book(bookTitle, bookAuthor, bookPages);   myLibrary.push(book);   console.log(bookTitle)   console.log(bookAuthor)   console.log(bookPages)   toggle();}我看到信息半秒鐘然后消失了。我知道我應(yīng)該在某處使用防止默認(rèn)值。我試過這個(gè)它正確顯示信息，但不會(huì)關(guān)閉模式。我該如何解決？