Joh*_*sen 10 html upload html5 file-upload google-apps-script
我试图改变ctrlq的代码(在这里找到:http://ctrlq.org/code/19747-google-forms-upload-files ),以便上传多个文件而不是1.
这是我到目前为止:HTML:
<form id="myForm">
<input type="text" name="myName" placeholder="Name">
<input type="password" name="psw" placeholder="Password">
<input type="text" name="myFolder" placeholder="Folder Name">
<input type="file" name="myFile" id="filesID" multiple>
<input type="submit" value="Upload File"
onclick="this.value='Uploading..';
google.script.run.withSuccessHandler(fileUploaded)
.uploadFiles(this.parentNode);
return false;">
</form>
<div id="output"></div>
<script>
function fileUploaded(status) {
document.getElementById('myForm').style.display = 'none';
document.getElementById('output').innerHTML = status;
}
</script>
<style>
input { display:block; margin: 20px; }
</style>
Google脚本:
function doGet(e) {
return HtmlService.createHtmlOutputFromFile('form.html');
}
function uploadFiles(form) {
try {
var input = document.getElementById('filesID');
var dropbox = "User Files";
var folder, folders = DriveApp.getFoldersByName(dropbox);
if (folders.hasNext()) {
folder = folders.next();
} else {
folder = DriveApp.createFolder(dropbox);
}
for (var i = 0; i < input.length; i++) {
var file = folder.createFile(input.input[i]);
file.setDescription("Uploaded by " + form.myName);
}
return "File uploaded successfully " + file.getUrl();
} catch (error) {
return error.toString();
}
}
我收到错误,说函数createFile不会运行.我希望这是因为变量myFile最初不是一个数组.如何将上传的所有文件放入数组中,然后为每个文件运行createFile？
谢谢
首先要注意，multipleHTML<input>标签上的属性是在 HTML5 中引入的，并且仅受现代浏览器支持（例如，对于 Gecko 1.9.2 的 Firefox，则从版本 3.6 开始）
现在，为了设置用于多个文件上传的 HTML 表单，您必须：
明确指定您的 HTML 文档是 HTML5。您的文件必须以以下内容开头：
<!DOCTYPE html>
为了正确地将文件上传到服务器，您必须将表单enctype属性设置为multipart/form-data：
<form id="myForm" enctype="multipart/form-data">
您还必须使用multiple 属性将文件输入标记指定为多文件输入标记。你似乎有这个权利，但以防万一尝试：
<input type="file" name="myFile" id="filesID" multiple="multiple" />
反而。
for在处理所选文件的 Javascript 代码循环中（至少）还存在一些问题；您正在引用input.length以及input.input[i]何时应该引用input.files.length，而input.files[i]不是：
for (var i = 0; i < input.files.length; i++) {
var file = folder.createFile(input.files[i]);
file.setDescription("Uploaded by " + form.myName);
}
我强烈建议您查看超级有用的 MDN关于处理文件上传的迷你教程，以获取详细信息和示例。
另外，如果您愿意添加库和插件，引导文件输入是一个非常有用的工具，可以非常简单地在您想要的任何形式上合并和使用。
无论如何，您最终都会得到一个表单，该表单发送一组文件，您也可以在客户端上将其作为存储在包含File对象的输入元素的files 属性上的FileList对象进行访问，而不仅仅是单个文件元素。如上面的代码所示，您可以以数组 ( ) 的形式访问此对象中的任何文件。FileListinput.files[i]
| 归档时间： |
|
| 查看次数： |
1662 次 |
| 最近记录： |