Javascript 将用户选择数据临时存储在我的阵列中

这是我的表格，下面是一个函数。我需要3个函数，1个用于存储数据，1个用于保存数据，1个用于显示所有存储的数据。我如何才能完成所有这些功能，使它们相互对应

注意：用户将输入数据，因此临时保存的是用户选择的数据。用户应该能够点击按钮来运行该功能，但我如何才能正确执行这三个功能

<form name = "Music">

            <p>Input a Song Name, Artist, Collaborations, Duration or Album</p>

            <input type="text" name = "Song_Name" id= "Song_Name" size="20"> <br> 
            <input type="text" name = "Artist" id= "Artist" size="20"> <br> 
            <input type="text" name = "Collaborations" id= "Collaborations" size="20"> <br> 
            <input type="text" name = "Duration" id= "Duration" size="20"> <br> 
            <input type="text" name = "Album" id= "Album" size="20"> <br> 

            <input type="button" value = "Save" onclick = "Save()"> <br>
            <input type="button" value = "Search" onclick = "Store()"> <br>
            <input type="button" value = "Show_All" onclick = "Show_All()"> <br>

---

首先，我建议将值存储在对象而不是数组中。当您有多个相关的数据块时，处理起来就容易多了。以下是它在商店和展览中的工作方式：

var catalogue;

function Store() {
    catalogue = {
        SongName: document.getElementById('Song_Name').value;
        Artist: document.getElementById('Artist').value;
        Collaborations: document.getElementById('Collaborations').value;
        Duration: document.getElementById('Duration').value;
        Album: document.getElementById('Album').value;
    }
}

function Show_All() {
    document.getElementById('Song_Name').value = catalogue.SongName;
    document.getElementById('Artist').value = catalogue.Artist;
    document.getElementById('Collaborations').value = catalogue.Collaborations;
    document.getElementById('Duration').value = catalogue.Duration;
    document.getElementById('Album').value = catalogue.Album;
}

---

如何处理“保存”将取决于您希望将其保存到的位置，但一般的想法是，您可以将目录值直接传递到保存它的位置，或者解析目录对象的属性，并将每个属性传递到保存它们的位置。

我尝试了该函数，但它不起作用，在函数实际工作之前，我是否必须先保存数据？因为我的想法是，我必须先存储数据。我希望存储的数据显示在屏幕上，可能作为提示。然后我想搜索数据，所以可能会再次出现提示，说“您已经搜索了…”等等。最后一部分显示用户存储的所有数据。再次感谢你的代码，但如果你能帮我，这将是很大的帮助！我不知怎的错过了你在做这件事时对它的评论，而刚才我注意到了。这么长时间了，我猜你不再需要帮助了。如果你这样做了，我想我需要更多的细节，当你点击每个按钮时，你到底想发生什么，以便能够提供任何有用的帮助。这是你第一次使用javascript？我这样问是因为语法完全错误。你能帮我正确地编写代码吗？为什么你的第二个按钮上写着“搜索”，而你的函数和描述上写着“存储”？存储和保存有什么区别？是的，我注意到了这一点，当我意识到我把它贴在这里后，我对它进行了更改。“搜索”按钮现在包括“搜索”功能。你能帮我学些什么吗。

var catalogue;

function Store() {
    catalogue = {
        SongName: document.getElementById('Song_Name').value;
        Artist: document.getElementById('Artist').value;
        Collaborations: document.getElementById('Collaborations').value;
        Duration: document.getElementById('Duration').value;
        Album: document.getElementById('Album').value;
    }
}

function Show_All() {
    document.getElementById('Song_Name').value = catalogue.SongName;
    document.getElementById('Artist').value = catalogue.Artist;
    document.getElementById('Collaborations').value = catalogue.Collaborations;
    document.getElementById('Duration').value = catalogue.Duration;
    document.getElementById('Album').value = catalogue.Album;
}