几天来我一直在努力确保在向谷歌驱动器提交 jpg 后,它会清理表单字段并为下一次插入下一条记录做好准备。它复制文件但不重置该字段。我想要的是,一旦他上传文件,他就会重置表单字段,而无需重新加载它等待下一个上传。这个例子是我从互联网上获取的,我正在尝试使其适应我的需要
HTML:
<html>
<head>
<base target="_top">
</head>
<body>
<form>
<input type="file" name="file" id="arq" />
<input type="submit" value="Upload File" id="id"/>
</form>
<script>
var vCampoEncarregado = document.getElementById('arq');
document.querySelector('form').addEventListener('submit',(e)=>{
e.preventDefault();
const vFileReader = new FileReader();
vFileReader.onload = function(e) {
const vValores = vFileReader.result.split(',');
const vObj = {
fileName: document.querySelector('input[id="arq"]').files[0].name,
mimeType: document.querySelector('input[id="arq"]').files[0].type,
data: vValores[1]
}
google.script.run.withSuccessHandler().SubirImagemAntes(vObj);
}
vFileReader.readAsDataURL(document.querySelector('input[id="arq"]').files[0]);
});
vCampoEncarregado.value = '';
</script>
</body>
</html>
GS:
function doGet() {
return HtmlService.createHtmlOutputFromFile('index');
}
function SubirImagemAntes(data) {
const myFile = Utilities.newBlob(Utilities.base64Decode(data.data), data.mimeType,data.fileName);
const Id = "ID";
const folder = DriveApp.getFolderById(Id);
const fileAdded = folder.createFile(myFile);
const resp = {
'url': fileAdded.getUrl(),
'name': data.fileName
};
return resp;
}
我相信您的目标如下。
既然如此,下面的修改如何?在这种情况下,您的 Google Apps 脚本不会被修改。您的 HTML 端修改如下。
From:
google.script.run.withSuccessHandler().SubirImagemAntes(vObj);
To:
google.script.run.withSuccessHandler(res => {
console.log(res);
document.getElementById("arq").value = "";
}).SubirImagemAntes(vObj);
Note:
-
当您修改Web Apps的Google Apps脚本时,请将部署修改为新版本。这样,修改后的脚本就会反映在Web Apps中。请注意这一点。
-
您可以在我的报告中看到详细信息“在不更改新 IDE 的 Web 应用程序 URL 的情况下重新部署 Web 应用程序(作者:我) https://gist.github.com/tanaikech/ebf92d8f427d02d53989d6c3464a9c43".
-
整个修改后的脚本如下。
<html>
<head>
<base target="_top">
</head>
<body>
<form>
<input type="file" name="file" id="arq" />
<input type="submit" value="Upload File" id="id"/>
</form>
<script>
var vCampoEncarregado = document.getElementById('arq');
document.querySelector('form').addEventListener('submit', (e) => {
e.preventDefault();
const vFileReader = new FileReader();
vFileReader.onload = function (e) {
const vValores = vFileReader.result.split(',');
const vObj = {
fileName: document.querySelector('input[id="arq"]').files[0].name,
mimeType: document.querySelector('input[id="arq"]').files[0].type,
data: vValores[1]
}
google.script.run.withSuccessHandler(res => {
console.log(res);
document.getElementById("arq").value = "";
}).SubirImagemAntes(vObj);
}
vFileReader.readAsDataURL(document.querySelector('input[id="arq"]').files[0]);
});
vCampoEncarregado.value = '';
</script>
</body>
</html>
参考:
- withSuccessHandler(函数) https://developers.google.com/apps-script/guides/html/reference/run#withSuccessHandler(Function)
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)