Question

Html无法识别谷歌脚本函数返回值

2021-02-12

65

javascript html google-apps-script

我正在尝试使用谷歌脚本创建一个基本的乘数。从 html 表单中获取两个变量，然后应在 code.gs 中的计算函数中将它们相乘，并返回答案。

我希望屏幕清除并显示一句话：“功能已成功完成，答案 =”+ ans。

ans 是两个输入变量的乘积。

我得到以下显示：

Function completed successfully, answer =NaN

在浏览器（Chrome）中检查控制台时出现以下错误：

Uncaught (in promise) TypeError: Cannot read property 'querySelectorAll' of null
    at s.<anonymous> (onloadwff.js:71)
    at l (onloadwff.js:71)
    at Object.next (onloadwff.js:71)
    at n (onloadwff.js:71)

如果我尝试使用以下代码在 html 中的任何位置调用该函数，我会收到相同的错误：

google.script.run.calculate();

我的代码：

index.hml

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <body>
    <form id="myForm">
      <input type="text" id="A" value="2"> X
      <input type="text" id="B" value="5">
      <input type="submit" onClick= " google.script.run.withSuccessHandler(answer).calculate(this.parentNode); return false;" value="Calculate"> = 
    </form>
    <div id="total" ></div>

  </body>
<script>
    function answer(status) {
        document.getElementById('myForm').style.display = 'none';
        document.getElementById('total').innerHTML = status;
    }
</script>

code.gs

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

function calculate(form){
  var num1 = parseInt(form.A);
  var num2 = parseInt(form.B);
  var ans = num1 + num2;

return "Function completed successfully, answer =" + ans;
}

Answer 1

您有此：

<form id="myForm">
  <input type="text" id="A" value="2"> X
  <input type="text" id="B" value="5">
  <input type="submit" onClick= " google.script.run.withSuccessHandler(answer).calculate(this.parentNode); return false;" value="Calculate"> = 
</form>

修改为：

<form id="myForm">
  <input type="text" name="A" value="2"> X
  <input type="text" name="B" value="5">
  <input type="submit" onClick= " google.script.run.withSuccessHandler(answer).calculate(this.parentNode); return false;" value="Calculate"> = 
</form>