Javascript 更新应用程序脚本中电子表格的下拉列表

我正在努力学习谷歌的HTML服务UI服务，并且正在努力找出如何从电子表格中的数据更新UI中的下拉列表。我从中复制了以下代码，效果很好。但是，如果我想使用and填充下拉列表以替换and和以下内容，它似乎不起作用

<p>List of things:</p>
<ul id="things">
    <li>Loading...</li>
</ul>

<script
src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js">
</script>
<script>
// The code in this function runs when the page is loaded.
$(function() {
  google.script.run.withSuccessHandler(showThings)
      .getLotsOfThings();
});

function showThings(things) {
  var list = $('#things');
  list.empty();
  for (var i = 0; i < things.length; i++) {
    list.append('<li>' + things[i] + '</li>');
  }
}
</script>

---

以下应用程序脚本项目文件使用电子表格数据填充UI中的下拉选择框。在主应用程序脚本项目文件中，默认名称为Code.gs，包括：

function doGet(request) {
  return HtmlService.createTemplateFromFile('DropDown')
         .evaluate().setSandboxMode(HtmlService.SandboxMode.NATIVE); 
}


function getMenuListFromSheet() {
  return SpreadsheetApp.openById(*SPREADSHEET_ID*).getSheets()[0]
         .getRange(2,1,4,1).getValues();  
}

您需要用包含要用于填充选择框的数据的电子表格的ID替换*SPREADSHEET_ID*。本例将第一张图纸A2:A5范围内的数据作为getRange函数中定义的要使用的数据

还请注意，此示例使用本机沙盒模式，这比默认模拟模式更宽容

此示例还需要应用程序脚本项目中名为“DropDown.HTML”的HTML文件，如下所示：

<p>List of things:</p>
<ul id="things">
    <li>Loading...</li>
</ul>

<select id="menu">
  <option></option>
  <option>Google Chrome</option>
  <option>Firefox</option>
</select>


<script
src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js">
</script>
<script>
// The code in this function runs when the page is loaded.
$(function() {
  google.script.run.withSuccessHandler(showThings)
      .getMenuListFromSheet();
  google.script.run.withSuccessHandler(showMenu)
      .getMenuListFromSheet();
});

function showThings(things) {
  var list = $('#things');
  list.empty();
  for (var i = 0; i < things.length; i++) {
    list.append('<li>' + things[i] + '</li>');
  }
}

function showMenu(menuItems) {
  var list = $('#menu');
  list.find('option').remove();  // remove existing contents

  for (var i = 0; i < menuItems.length; i++) {
    list.append('<option>' + menuItems[i] + '</option>');
  }
}

</script>

这个HTML文件由一个列表和一个选择框组成，两个都有默认内容。加载页面时，两者的内容都将替换为getMenuListFromSheet函数提供的内容，该函数从电子表格中提取其返回值

您可以创建绑定到电子表格容器的这些应用程序脚本项目文件，然后将其发布为web应用程序