时间戳

首页 > 解决方案 > 如何使用 Google Apps 脚本在 Google 表格中的 htmloutput 中添加其他内容

html - 如何使用 Google Apps 脚本在 Google 表格中的 htmloutput 中添加其他内容

问题描述

我找到了使用 HTML 输出创建弹出窗口的代码。当前设置为显示一个项目：在新选项卡中超链接到网站的标题。我有兴趣向此弹出窗口添加其他内容。

2个愿望：

  1. 在弹出窗口中显示多个链接
  2. 显示附加内容（例如，链接上方的介绍段落；链接描述

我尝试使用多个 showAnchor 函数调用提醒函数，结果只显示最后一个链接我尝试在提醒函数中使用数组作为 showAnchor 函数的“名称”和“url”。下面的代码以及在相关应用程序脚本的 notepad.gs 代码文件中包含此代码的示例表。

function onOpen() {
  var ui = SpreadsheetApp.getUi();
  ui.createMenu('⚙️ Custom')
    .addItem('Show Reminders','reminders')
    .addToUi();

}

function reminders(){
  showAnchor('Google','https://www.google.com/');
}

function showAnchor(name,url) {
  var html = '<html><body><a href="'+url+'" target="blank" onclick="google.script.host.close()">'+name+'</a></body></html>';
  var ui = HtmlService.createHtmlOutput(html)
  SpreadsheetApp.getUi().showModelessDialog(ui,'Reminders');
}

https://docs.google.com/spreadsheets/d/1Sqt7_Ev9iagbE9CZT1F2lAUJqc1fX4WfbyaOBGEfqyQ/edit?usp=sharing

标签： htmlgoogle-apps-scriptgoogle-sheets

解决方案

尝试这个：

function reminders() {
  showAnchors([
    {
      description: 'Search the web without being tracked',
      name: 'DuckDuckGo',
      url: 'https://duckduckgo.com/',
    },
    {
      description: 'A fairly popular search engine',
      name: 'Google',
      url: 'https://www.google.com/',
    },
  ]);
}

function showAnchors(anchors) {
  let html = '<html><body style="word-break:break-word; font-family:sans-serif;">';
  html += '<p>Introduction paragraph above links.</p>'
  anchors.forEach(anchor => {
    html += '<h3>' + anchor.description + '</h3>'
      + '<a href="'
      + anchor.url
      + '" target="_blank" rel="noopener" onclick="google.script.host.close()">'
      + anchor.name
      + '</a>';
  });
  html += '</body></html>';
  SpreadsheetApp.getUi()
    .showModelessDialog(HtmlService.createHtmlOutput(html), 'Reminders');
}

推荐阅读