Question

我正在尝试为gSheets创建一个附加组件，以显示带有动态数量的按钮的侧边栏或对话框，这些按钮是从被单击的单元格中的文本派生的。

目标列的单元格中的单词数量有所变化。目的是将单词加载到一维数组中，并将每个单词用作按钮的标签。然后，通过单击按钮，将与按钮标签相同的文本复制到剪贴板。

我已经成功地将选定单元格的内容按如下方式加载到数组中（目标字符串由句点分隔）：

  function splitText() {
     var array1 = [{}];
     var string1 = SpreadsheetApp.getActiveRange().getValue();

     array1 = string1.split('. ');

     for(var i=0; i<array1.length; i++){
        array1[i] = '\\n'+'\\n'+array1[i];
     }

在边栏中包含自定义按钮需要引用我正在做的HTML文件，如下所示：

function openSidebar(){
  var html = HtmlService.createHtmlOutputFromFile('Sidebar').setTitle('Text Copy Buttons');
  SpreadsheetApp.getUi().showSidebar(html);
}

我熟悉创建按钮的基本HTML，如下所示：

<body>
    <button onclick='myFunction()' id='button1'>LABEL TO BE ASSIGNED</button>
</body>

我想知道如何通过遍历数组并将每个数组值分配给新的按钮标签来创建可变数量的按钮。任何建议，不胜感激！

Answer 1

您可以尝试jQuery：

流量：

通过div内的按钮提供基本HTML
在窗口端使用splitText在服务器端运行google.script.run功能
从splitText接收数组，并使用jQuery div更新append
或者，您可以直接使用模板HTML进行附加的for循环。

Index.html：

<head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <script>
    $(function(){
      google.script.run.withSuccessHandler(showButtons)
        .splitText()
    });

function showButtons(arr){
  var b = $('#buttons');
  b.empty();
  for (var i=0;i<arr.length;i++){
    b.append("<button onclick='myFunction()' id='button"+i+"'>"+arr[i]+"</button>")
  }
}
  </script>  
</head>  

<body>
  <div id ="buttons">
    <button onclick='myFunction()' id='button'>LABEL TO BE ASSIGNED</button>
  </div>
</body>

Code.gs：

function splitText() {
  return SpreadsheetApp.getActiveRange().getValue()
  .toString()
  .split('. ');
  }

使用数组值在HTML中分配按钮标签

1 个答案:

流量：

Index.html：

Code.gs：

参考文献：