Question

在 Google Apps Script 中使用 Javascript

2017-04-03

179

javascript html google-apps-script

我正在尝试创建一个简单的输入输出 webapp，但一直很难让它正常工作。这个想法是从文本区域获取用户输入，向其中添加一些简单的 html 标签，然后将其输出到另一个文本区域。这只是为了帮助一些同事简化他们的操作。

我决定制作一个独立的 Google Apps Script webapp，并使用 HTML 服务来创建我的 UI。计划是在该 HTML 中运行 Javascript。

我已经在 W3schools 的 TryIt 编辑器上测试了以下代码，它运行良好。当我在 StackOverflow 的“运行代码片段”上运行它时，它甚至可以正常工作。但是当我测试我的 webapp 时它不起作用。

帮忙？

<!DOCTYPE html>
<html>
  <body>
  <br>
    <textarea rows=12 cols= 50 align=left id="input" placeholder='Insert text here...'></textarea>
    <input type="button" value="Try It" onclick="myFunction()" />
    <textarea rows=12 cols= 50 align=right id="output" placeholder='Copy this text...' readonly></textarea>
  </body>
  <script type="text/JavaScript">
    <!--
    function myFunction() {
      var x = document.getElementById("input").value;
      document.getElementById("output").innerHTML = x;
    }
    -->
  </script>
</html>

Answer 1

嗯，解决方案/问题很简单。您的属性值（如 cols = 50）需要用引号括起来。如下所示：

cols ="50"

您修改后的代码：

<!DOCTYPE html>
<html>
  <body>
  <br>
    <textarea rows="12" cols= "50" align="left" id="input" placeholder='Insert text here...'></textarea>
    <input type="button" value="Try It" onclick="myFunction()" />
    <textarea rows="12" cols= "50" align="right" id="output" placeholder='Copy this text...' readonly></textarea>
  </body>
  <script type="text/JavaScript">
    <!--
    function myFunction() {
      var x = document.getElementById("input").value;
      document.getElementById("output").innerHTML = x;
    }
    -->
  </script>
</html>

这个方法有效而前一个方法无效的原因是 google HTMLservice 评估 HTML 代码的方式。使用您的 HTML 代码，它会将您的文本区域评估为：

<textarea rows="12 cols= 50 align=left id="input" placeholder='Insert text here...'></textarea>

如您所见，它将行属性设置为

"12 cols =50 align=left id="

因此，当您运行函数时，它无法找到 id =“input”的元素并在控制台中抛出错误。

希望有所帮助。