函数未在谷歌脚本 HTML 服务中执行答案

【问题标题】：Function not executing in google script HTML service函数未在谷歌脚本 HTML 服务中执行
【发布时间】：2020-10-30 17:59:51
【问题描述】：

我正在为我自己和我的同学编写一个工具，该工具将创建一个谷歌文档并将其通过电子邮件发送给选定的老师，使用所有已填写的字段并填写所有未使用所选主题默认值的字段，例如语言艺术，但获取所选信息并使用它发送电子邮件的功能未执行。我已经检查了项目的执行情况，函数customDoc() 还没有执行过一次。我怀疑这是我的 HTML 的问题，因为当我在编辑器中测试函数以查看是否有任何语法错误时，我没有看到任何错误消息，但它很干净，只是从未执行过。这是我的代码，虽然 HTMl 中可能出现错误，但我也会提供我的 JS。

function doGet() {
  return HtmlService.createHtmlOutputFromFile('Index.html');
}

function showDialoge() {
  SpreadsheetApp.getUi().showModelessDialog(HtmlService.createHtmlOutputFromFile('Index.html'), 'Test');
}

function customDoc(clicked_id) {
  var d = new Date();
  var s = (d.getDate()) + '/' + (d.getMonth() + 1) + '/' + d.getFullYear();
  console.log(s);
  var cycler = clicked_id
  var math = ['esmith3@op97.org', 'math for ']
  var LA = ['cborah@op97.org', 'la for ']
  var science = ['lgrimaldi@op97.org', 'science for ']
  var is = ['charrington@op97.org', 'I&S for ']
  var span = ['vlagioia@op97.org', 'Espanol para ']
  var presets = [math, LA, science, is, span]
  var email1 = document.getElementById('Email')
  var subject1 = document.getElementById('Sub')
  var docName1 = document.getElementById('docName')
  var message1 = document.getElementById('message')
  var email = null
  if (email1 != ' ') {
    email = email1
  } else {
    email = presets[cycler];
    [1];
  }
  var subject = null
  if (subject1 != ' ') {
    subject = subject1
  } else {
    subject = presets[cycler];
    [2]; + s
  }
  var doc = null
  if (docName1 != ' ') {
    doc = docName1
  } else {
    doc = presets[cycler];
    [2]; + s
  }
  var document = documentApp.create(doc)
  var url = document.getUrl();
  var message = null
  if (message1 != ' ') {
    message = message1 + '' + url
  } else {
    message = url
  }

  GmailApp.sendEmail(email, subject, message);
}

<!DOCTYPE html>
<script src="Code.gs"></script>
<html>
<h1>CREATE DOC</h1>

<body>


</body>
<p>Email</p>
<input type='text' id='Email' value=' ' style="border-radius: 20px; border-color: crimson; border-width:20px; ">
<p style=" font-family: Times New Roman, Times, serif;">Doc name</p>
<input type='text' id='docName' value=' ' style="border-radius: 20px; border-color: crimson; border-width:20px; ">
<p>Subject</p>
<input type='text' id='Sub' value=' ' style="border-radius: 20px; border-color: crimson; border-width:20px; ">
<p>message</p>
<input type='text' id='message' value=' ' style="border-radius: 20px; border-color: crimson; border-width:20px; ">

<h2>Fill blanks for subject: </h2>


<button id='2' onclick=c ustomDoc(this.id)> LA </button>
<button id='3' onclick=c ustomDoc(this.id)> Science </button>
<button id='4' onclick=c ustomDoc(this.id)> Individuals and societies </button>
<button id='5' onclick=c ustomDoc(this.id)> Spanish  </button>
<button id='1' onclick=c ustomDoc(this.id)> math </button>


</html>

【问题讨论】：

.getElementByid() !== .getElementById()
这个应该在我的js文件里吗？
不，他想告诉你的是，getElementByid 不存在。而是使用getElementById。 Javascript 区分大小写。
噢噢噢噢。平心而论，他本可以说得更清楚一点。
我用 getElementById 修正了错字，但它仍然不起作用

标签： javascript html google-apps-script

【解决方案1】：

简而言之，customDoc() 是一个服务器函数，您需要使用 google.script.run 告诉 Apps Script 运行特定的服务器函数。所以不要打电话给onclick="customDoc(this.id)"，试试onclick="google.script.run.customDoc(this.id)"。不要在您的 HTML 文件中包含 Code.gs，因为那是服务器端代码，它不起作用。我强烈推荐阅读Client-to-Server Communication guide。

您的customDoc() 函数是另一回事 :) 下面是一种使用objects 重新组织不同预设（例如主题）的非常简单的方法。我还将您的日期格式代码替换为Utilities.formatDate()，这可能更容易理解。

function doGet() {
  return HtmlService.createHtmlOutputFromFile('Index.html');
}

function customDoc(subject) {
  var subjects = {
    'math': {
      email: 'teacher@example.com',
      preSubject: 'math for '
    },
    'la': {
      email: 'teacher@example.com',
      preSubject: 'la for '
    },
    'science': {
      email: 'teacher@example.com',
      preSubject: 'science for '
    },
    'is': {
      email: 'teacher@example.com',
      preSubject: 'I&S for '
    },
    'spanish': {
      email: 'teacher@example.com',
      preSubject: 'Español para '
    }
  };

  var formattedDate = Utilities.formatDate(new Date(), Session.getScriptTimeZone(), 'M/d/yyyy');
  
  console.log('Today: ' + formattedDate);
  console.log('Subject: ' + subject);
  console.log(subjects[subject]);
}

<!DOCTYPE html>
<html>
  <body>
    <h1>CREATE DOC</h1>
    <p>Email</p>
    <input type="text" id="Email" value=" " style="border-radius: 20px; border-color: crimson; border-width: 20px" />
    
    <p style="font-family: Times New Roman, Times, serif">Doc name</p>
    <input type="text"  id="docName" value=" " style="border-radius: 20px; border-color: crimson; border-width: 20px" />
    
    <p>Subject</p>
    <input type="text" id="Sub" value=" " style="border-radius: 20px; border-color: crimson; border-width: 20px" />
    
    <p>message</p>
    <input type="text" id="message" value=" " style="border-radius: 20px; border-color: crimson; border-width: 20px" />

    <h2>Fill blanks for subject:</h2>

    <button id="la" onclick="google.script.run.customDoc(this.id)">LA</button>
    <button id="science" onclick="google.script.run.customDoc(this.id)">Science</button>
    <button id="is" onclick="google.script.run.customDoc(this.id)">Individuals and societies</button>
    <button id="spanish" onclick="google.script.run.customDoc(this.id)">Spanish</button>
    <button id="math" onclick="google.script.run.customDoc(this.id)">math</button>
  </body>
</html>

尝试运行上述程序并单击科学按钮。你应该得到一个执行日志，如：

Today: 10/30/2020
Subject: science
{preSubject=science for , email=teacher@example.com}

现在customDoc() 正在实际执行，您可以开始尝试修复 Google Doc 生成。在我看来，您正在创建一个完全空白的 Google 文档，这可能不是您想要的。我认为您需要再做一些工作，然后如果您对生成文档有更具体的问题，请再回来。祝你好运！

【讨论】：

好吧，现在发生的事情是收件人要么未定义，要么当我定义它时显示意外标识符。
@LlamaButt 你指的是收件人吗？
您是否在输入栏中输入了正确的电子邮件地址？我认为主要问题是您没有将输入的电子邮件地址传递给单击按钮时运行的 Apps 脚本函数。您能否尝试将其作为customDoc() 函数的参数传递并让我知道这是怎么回事？谢谢！