使用 JS 将 html 数据保存到 .xlsx答案

【问题标题】：Saving html data to .xlsx using JS使用 JS 将 html 数据保存到 .xlsx
【发布时间】：2021-10-26 01:45:53
【问题描述】：

我无法弄清楚如何使用 JS（java 脚本）将输入到 html 页面的数据保存到 .xlsx 文件中。我需要该文件才能获取用户名电子邮件和电话号码，然后一旦按下提交按钮，我需要它将用户输入保存到 .xlsx 文件中，其中包含名称的前 3 个字母和前 3 个数字那里的电话号码（在区号之后）是文件的名称。我该怎么做？

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="styles-Test_2.css">
    <title>Pre Enrolment Form</title>
</head>
<body>
    <div class="regform">
        <h1><center><u><b>Pre Enrolment Form</b></u></center></h1>
    </div>
    <div class="main">
    
        <form method="POST">
            <h2><center><u>Student Information</u></center></h2>
            <div id="name">
                <center><input class="firstname" type="text" name="first_name" placeholder="First Name" size="25">
                <input class="lastname" type="text" name="last_name" placeholder="Last Name" size="25"></center>
            </div>
            
                <br><center><input class="entry" type="text" name="entry" placeholder="Year Of Entry" size="25">
                <input class="s-email" type="email" name="s-email" placeholder="Student Email" size="25"></center>
                <br><center><input class="dob" type="text" name="dob" placeholder="Student's DOB (dd/mm/yyyy)" size="25">
                <input class="address" type="text" name="address" placeholder="Address" size="25"></center>
                <br><center><input class="school" type="text" name="school" placeholder="Current School" size="25">
                <input class="school-contact" type="email" name="school-contact" placeholder="Contact Person At That School" size="25"></center>
    
            <center><h3 class="pathway"><u>Pathway Interests</u></h3>
                <select class="option" name="subject">
                <option disabled="disabled" selected="selected">--Choose option--</option>
                <option>VCE/Mainstream</option>
                <option>ACE</option>
            </select></center>
            
            <center><h3 id="enrolled?"><u>Currently Enrolled?</u></h3>
            <label class="enrolled?">
                <input class="yes" type="radio" name="radiobtn"
                <span class="checkmark"></span>
                Yes
            </label>
            
            <label class="enrolled?">
                <input class="no" type="radio" name="radiobtn">
                <span class="checkmark"></span>
                No
            </label></center>
                
                <h2><center><u>Parent/Guardian Information</u></center></h2>
                <br><center><input class="pg-fname" type="text" name="pg-fname" placeholder="Parent/Guardian First Name" size="25">
                <input class="pg-lname" type="text" name="pg-lname" placeholder="Parent/Guardian Last Name" size="25"></center>
                <br><center><input class="p-email" type="email" type="text" name="p-email" placeholder="Email Address" size="25">
                <input class="phone" type="text" name="phone" placeholder="Phone Number" size="25"></center>
                
            <center><h3 class="how-did-you-hear-about-SDC"><u>How Did You Hear About Sunbury Downs College?</u></h3>
                <select class="option2" name="how">
                <option disabled="disabled" selected="selected">--Choose Option--</option>
                <option>Website</option>
                <option>Facebook</option>
                <option>Instagram</option>
                <option>Advertisement</option>
                <option>Primary School</option>
                <option>Word Of Mouth</option>
                <option>Sign</option>
            </select></center>
                
                
            <center><h3 id="siblings?"><u>Do you have any siblings here?</u></h3>
            <label class="siblings?">
                <input class="yes" type="radio" name="radiobtn2">
                <span class="checkmark"></span>
                Yes
            </label>
            
            <label class="siblings?">
                <input class="no" type="radio" name="radiobtn2">
                <span class="checkmark"></span>
                No
            </label></center>
    
            <br><center><button class="register" type="submit" style="height:50px; width:300px; font-size:20px">Submit</button></center>
    
        </form>
</div>
</body>
</html>

【问题讨论】：

"这是否可能" 只要有足够的时间、金钱和资源，软件中的大多数事情都是可能的。因此，这种格式的问题不太适合 Stack Overflow 的问答格式，因为它们方式太宽泛了。另见：How to Ask
这样更有意义吗？
有道理，但这里还是太宽泛了。这里的问题通常与您在使用已编写的代码时遇到的特定代码级问题有关。提出这种风格的问题（寻求正确方向的一般指示、广泛的设计指导等）仍然被认为是本网站的题外话。
这样更好吗
很遗憾不是 - 就像我说的，这个网站主要是针对代码的问题您已经自己编写以满足您的要求，而不是针对没有任何问题的广泛设计查询代码已经写好了。

标签： javascript html submit

【解决方案1】：

是的，你可以做到！

有一个名为SheetJS的JS库。

还有一个问题方法的链接 How to simply export a Worksheet to xlsx?

【讨论】：