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

时间:2021-02-12 10:16:19

标签: javascript html google-apps-script

我想要做的是使用谷歌脚本创建一个基本的乘数。从一个html表单中获取两个变量,然后在code.gs中的calculate函数中将它们相乘并返回答案。

我希望屏幕清晰,并显示一句话:“功能成功完成,回答=”+答案。

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;
}

1 个答案:

答案 0 :(得分:0)

你有这个:

<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>