我有一个表单,我将传递给应用程序脚本函数。其中一个表单元素是一个允许用户进行多项选择的列表框。每当从列表框中选择一个项目时,该函数(从另一个输入元素上传图像)运行正常,但只要选择了两个或更多项目,该函数就会失败。虽然该函数从不使用列表框,但是有一些原因导致它成为表单的一部分可能会导致将其传递给函数的问题,以及如何解决它?
HTML片段:
<form id="classForm">
<img id="previewImg" width=300px>
<input type="file" name="imageLoader" id="imageUpload" accept="image/*" onchange="upload();">
<select multiple="true">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
</select>
</form>
使用Javascript:
<script type="text/javascript">
//This function stub passes in the form to a function that uploads a user-provided image for preview use
function upload(){
var form = document.getElementById("classForm");
google.script.run.withSuccessHandler(uploadResult).uploadFile(form);
google.script.run.withFailureHandler(uploadResult).uploadFile(form);
}
//This function displays a preview of the user's ad image
//Data in: id of image, to be used to generate url
function uploadResult(url){
url = "https://docs.google.com/uc?id=" + url;
$('#previewImg').attr('src', url);
}
//clears input so that onchange will fire even if user selects same image
$(document).on("click", "#imageUpload", function() {
this.value = null;
});
</script>
该功能(从上传调用,进行一些处理,然后在表单中发送):
function uploadFile(form) {
// Name of folder where the files should be saved
var folderName = "AdImages";
var folder, folders = DriveApp.getFoldersByName(folderName);
//Find the folder, create if the folder does not exist
if (folders.hasNext()) {
folder = folders.next();
} else {
folder = DriveApp.createFolder(folderName);
}
// Get file from form as blob
var blob = form.imageLoader;
var file = folder.createFile(blob);
// Set the file description to something
file.setDescription("title");
//get picID
var picId = file.getId();
// Return the id of the picture, to be used to construct the previewable url
return picId;
}
答案 0 :(得分:0)
我通过以自己的形式包装文件输入元素来解决了这个问题。它无疑是一个hacky解决方案,但由于我只需要访问相关函数的一个特定元素,它就可以完成工作。