javascript 在 Apps Script 函数中获取 html 文本框的值
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/16525553/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Get value of html text box in Apps Script function
提问by user1916075
Something is wrong here, and all the suggestions I've tried from others with similar questions don't seem to work.
这里出了点问题，我从其他有类似问题的人那里尝试过的所有建议似乎都不起作用。
I have two files: myPage.html and myCode.gs in google scripts. I have deployed the html file as a web app, and I have figured out (with help) how to make the onclick event for the 'submit' button to trigger the emailTech function from the myCode.gs file just fine.
我有两个文件：谷歌脚本中的 myPage.html 和 myCode.gs。我已将 html 文件部署为 Web 应用程序，并且我已经想出（在帮助下）如何为“提交”按钮创建 onclick 事件以触发 myCode.gs 文件中的 emailTech 函数就好了。
Now I want to insert the value from the text box in the html file into the email that is called from the onClick event. I have tried document.getElementById('textBoxId').value, but I get the following error "Reference Error: "document" is not defined. " What gives?
现在我想将 html 文件中文本框中的值插入到从 onClick 事件调用的电子邮件中。我试过了document.getElementById('textBoxId').value，但出现以下错误“参考错误：“文档”未定义。“是什么导致的？
myPage.html file:
myPage.html 文件：
<html>
<head>
<title>Test Page</title>
</head>
<body>
<input type="button" onClick="google.script.run.emailTech();" value="Submit" />
<input type="text" value=" " id = "textBox" name = "textBox" />
</body>
<script type="text/javascript">
</script>
</html>
myCode.gs file:
myCode.gs 文件：
function doGet() {
return HtmlService.createHtmlOutputFromFile('myPage');
}
function emailTech(){
var nameBox = document.getElementById('textBox').value;
var message = "This is the text box value" + nameBox;
MailApp.sendEmail("[email protected]", "This is the subject", message );
}
回答by Mogsdad
The error message is correct - in your Apps Script function emailTech(), there is no variable in scope that's named document.
错误消息是正确的 - 在您的 Apps 脚本函数中emailTech()，范围内没有名为 的变量document。
You've got two different ways of deploying Apps Script WebApps mixed up. Since you're using the HTML Service (and your user interface is an html file), you can't use the UI Service methods (like getElementById()) to access input values. So, you'll do something different.
您有两种不同的部署 Apps Script WebApps 的方法。由于您使用的是 HTML 服务（并且您的用户界面是一个 html 文件），您不能使用 UI 服务方法（如getElementById()）来访问输入值。所以，你会做一些不同的事情。
To tie the submit button and input field together, use a form, enclosed in <form>tags. The submit button will still have an onclick function, but now it will be a javascript function embedded in your HTML, which will pass all the input from the form to your emailTech()function.
要将提交按钮和输入字段联系在一起，请使用包含在<form>标签中的表单。提交按钮仍然有一个 onclick 函数，但现在它将是一个嵌入在您的 HTML 中的 javascript 函数，它将把表单中的所有输入传递给您的emailTech()函数。
In your apps-script-side handler, you'll receive the form input as an Object, with the fields from the form as key-value pairs. The key is the namefrom the field.
在您的应用程序脚本端处理程序中，您将接收表单输入作为对象，表单中的字段作为键值对。关键是name来自现场。
The general solution is described in this answer. Here's a version that fits your code. I've left out the success and failure handling that Arun shows. You should build in error checking before deploying this in real life, of course.
此答案中描述了一般解决方案。这是一个适合您的代码的版本。我忽略了 Arun 展示的成功和失败处理。当然，在现实生活中部署之前，您应该先进行错误检查。
Code.gs
代码.gs
function doGet() {
return HtmlService.createHtmlOutputFromFile('myPage');
}
function emailTech(form){
var nameBox = form.techEmail;
var message = "This is the text box value" + nameBox;
MailApp.sendEmail("[email protected]", "This is the subject", message );
}
myPage.html
我的页面.html
<html>
<head>
<title>Test Page</title>
</head>
<body>
<form>
<input type="text" value=" " name="techEmail" />
<input type="button" onClick="formSubmit()" value="Submit" />
</form>
</body>
<script type="text/javascript">
function formSubmit() {
google.script.run.emailTech(document.forms[0]);
}
</script>
</html>
