首页 > 解决方案 > 按钮单击仅将值数组的一部分添加到 Google Sheets 电子表格

问题描述

我正在关注来自 https://www.youtube.com/watch?v=RRQvySxaCW0&list=PLv9Pf9aNgemt82hBENyneRyHnD-zORB3l&index=1的视频

我逐步创建了网络应用程序,但似乎只是记录了日期。使用的代码:

代码.gs

function doGet(e) {
  //Logger.log(e.parameter);
   return HtmlService.createHtmlOutputFromFile("page")
 }

 function userClicked(name){
   url = "https://docs.google.com/spreadsheets/d/1jWpCgCH8oziO6-JrRhP0A6BEpN00BGJb7y9bbASykT0/edit#gid=0";
   var ss = SpreadsheetApp.openByUrl(url);
   var ws = ss.getSheetByName("Data");
   ws.appendRow([name, new Date()]);
   //Logger.log(name+ " clicked the button");
  }

page.html

 <!DOCTYPE html>
 <html>
 <head>
   <base target="_top">
</head>
<body>
   <h1> Hello </h1>
<label> Name: </label> <input type = "text" id = "username">
<button id = "btn"> Click Here! </button>

<script> 
  document.getElementById("btn").addEventListener("click", doStuff());

   function doStuff(){
     var uname = document.getElementById("username").value;
     google.script.run.userClicked(uname);
     document.getElementById("username").value = "";
   }


</script>
</body>
</html>

你能指出我错过了什么吗?

标签: javascripthtmlgoogle-apps-scriptgoogle-sheetsaddeventlistener

解决方案


错误在行 document.getElementById("btn").addEventListener("click", doStuff());

  • 使用带括号的函数名doStuff()会使函数在页面加载时直接执行,而不是在事件侦听器上执行。
  • 要仅在事件侦听器上执行功能,请使用不带括号的语法 -document.getElementById("btn").addEventListener("click", doStuff);

参考:

笔记:

  • 在代码的不同战略部分实现日志(例如,console.log(uname)`0 以排除执行流程出错的地方是一种很好的做法。

推荐阅读