本地HTML使用JSZip

JSZip是一个用于创建、读取和修改Zip文件的JavaScript库，可以在浏览器和Node.js环境中使用。以下是一个使用JSZip创建zip文件的示例： ```javascript import JSZip from 'jszip' // 创建一个JSZip实例 const zip = new JSZip() // 向zip文件中添加一个文件 zip.file('hello.txt', 'Hello World!') // 将zip文件导出为二进制数据 zip.generateAsync({ type: 'blob' }).then((content) => { // 将二进制数据保存为文件 saveAs(content, 'hello.zip') }) ``` 上述代码中，我们首先创建了一个JSZip实例，然后向zip文件中添加了一个名为`hello.txt`的文件，文件内容为`Hello World!`。最后，我们使用JSZip提供的`generateAsync`方法将zip文件导出为二进制数据，并使用FileSaver.js库提供的`saveAs`函数将二进制数据保存为文件。在实际应用中，我们可以将表单数据转换为JSON字符串，然后将JSON字符串存储到zip文件中，以实现将表单数据封装成zip文件的功能。具体实现方法可以参考上面给出的示例。

本地HTML使用JSZip生成压缩包，并点击下载

生成并下载压缩包可以使用JSZip库和Blob对象。以下是一个示例代码： ```html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>JSZip Demo</title> <script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.6.0/jszip.min.js"></script> <script> function generateZip() { // 创建一个JSZip实例 var zip = new JSZip(); // 添加一些文件到压缩包中 zip.file("hello.txt", "Hello World\n"); zip.file("world.txt", "Hello Earth\n"); // 生成压缩包 zip.generateAsync({type:"blob"}).then(function(content) { // 创建一个下载链接 var link = document.createElement('a'); link.download = "example.zip"; // 下载文件的文件名 link.href = URL.createObjectURL(content); // 将Blob对象转换为URL document.body.appendChild(link); link.click(); // 触发下载 document.body.removeChild(link); // 下载完成后删除链接 }); } </script> </head> <body> <button onclick="generateZip()">生成压缩包</button> </body> </html> ``` 运行这个示例代码后，点击 "生成压缩包" 按钮将会生成并下载一个包含两个文件的压缩包。

本地HTML使用JSZip