Question

当我单击按钮时，将运行一个功能。该函数生成一个字符串，我正在尝试在div标签中向用户显示此字符串。

我尝试了几种调试方法。例如，我检查onclick是否正常工作。因此，当我单击按钮时，我确实看到了“已单击！”。然后“在功能中”。这是预期的。但是，此后，它应该显示listAllEvents函数生成的字符串。但是，它似乎无法正常工作。（它按预期记录结果；只是不显示在屏幕上。）

<!DOCTYPE html>
<html>

<head>
    <base target="_top">
</head>

<body>
    <script>
        function myFunction() {
            document.getElementById("data").innerHTML = "Clicked!";
            listAllEvents()
        }


    function listAllEvents() {
        document.getElementById("data").innerHTML = "In Function!";
        var calendarId = 'primary';
        var now = new Date();
        var display = ""
        var events = Calendar.Events.list(calendarId, {
            timeMin: now.toISOString(),
            maxResults: 2500,
        });
        if (events.items && events.items.length > 0) {
            for (var i = 0; i < events.items.length; i++) {
                var event = events.items[i];

                if (event.start.date) {
                    // All-day event.
                    var start = new Date(event.start.date);
                    var end = new Date(event.end.date);
                    display = display + 'Start: ' + start.toLocaleDateString() + '; End: ' + end.toLocaleDateString() + ". ";
                } else {
                    var start = new Date(event.start.dateTime);
                    var end = new Date(event.end.dateTime);
                    display = display + 'Start: ' + start.toLocaleString() + '; End: ' + end.toLocaleString() + ". ";
                }
            }
        } else {
            display = 'No events found.';
        }

        Logger.log('%s ', display);
        document.getElementById("data").innerHTML = "Almost There";
        document.getElementById("data").innerHTML = display;
    }
</script>

<div id="data"> Hello! </div>
<button onclick="myFunction()">Run Function</button>

预期，请点击：开始...结束。

实际：“功能正常！”

Answer 1

它崩溃是因为Calendar是undefined。浏览器的控制台会告诉您。

Answer 2

不能在客户端上使用服务器端代码

问题是您试图在客户端上运行服务器端代码。

service

当您要运行服务器端Google脚本时，可以使用google.script.run

对其进行调用

这是一个如何使用google.script.run

的简单示例

这是基本框架：

您的html文件：

单击按钮会调用Javascript函数getCalendarEvents，该函数准备将适当的数据（在这种情况下可能不是必需的）传递给服务器，然后调用服务器上的listCalendarEvents。服务器功能获取事件并将其返回给withSuccessHandler，然后该处理程序将信息放入html页面。

const Container = (() => {
  const secretsByInstance = new WeakMap();
  function dec(instance) {
    const secret = secretsByInstance.get(instance);
    if (secret > 0) {
      secretsByInstance.set(instance, secret - 1);
      return true;
    } else {
      return false;
    }
  }
  function Container(param) {
    secretsByInstance.set(this, 3);
    this.member = param;
  }
  Container.prototype.service = function() {
   return dec(this) ? this.member : null;
  };
  return Container;
})();

d1 = new Container("content");
console.log(d1.service());
console.log(d1.service());
console.log(d1.service());
console.log(d1.service());

code.js：

   function listAllEvents() {
        document.getElementById("data").innerHTML = "In Function!";
        var calendarId = 'primary';
        var now = new Date();
        var display = ""
        var events = Calendar.Events.list(calendarId, {//This is server side Google Script
            timeMin: now.toISOString(),
            maxResults: 2500,
        });
        if (events.items && events.items.length > 0) {
            for (var i = 0; i < events.items.length; i++) {
                var event = events.items[i];

                if (event.start.date) {
                    // All-day event.
                    var start = new Date(event.start.date);
                    var end = new Date(event.end.date);
                    display = display + 'Start: ' + start.toLocaleDateString() + '; End: ' + end.toLocaleDateString() + ". ";
                } else {
                    var start = new Date(event.start.dateTime);
                    var end = new Date(event.end.dateTime);
                    display = display + 'Start: ' + start.toLocaleString() + '; End: ' + end.toLocaleString() + ". ";
                }
            }
        } else {
            display = 'No events found.';
        }

        Logger.log('%s ', display);
        document.getElementById("data").innerHTML = "Almost There";
        document.getElementById("data").innerHTML = display;
    }

修复on_click函数以更改文本

2 个答案: