Question

我正在开发一个使用Google Apps脚本以及HTML和JS的项目。我对编程很新，所以如果这是一个简单的问题，请耐心等待。

基本上，在我的JS文件中，我有一个函数，使用this method调用Google Apps脚本（从现在开始，GAS）文件中包含的函数; GAS函数使用从Google表格中检索的值填充数组并返回数组。然后，JS文件使用此数组填充HTML文件中的下拉列表。

问题是根本没有填充下拉列表;如果我在谷歌Chrome控制台上重新加载页面，我看到数组是空的;但是，如果单击空数组，则会显示值，就好像它没有在页面加载时填充一样。请参阅下面的图片，以便更好地理解我的意思：

Google Chrome Console screenshot

您将在下面找到处理不同功能的相关代码片段：

JS：

$(function() {

  var cities = [];

  function onSuccess(elem, array) {
    var i = 0;
    for (item in elem) {
      array.push(elem[i])
      i++;
    };
    return array
  };

  google.script.run.withSuccessHandler(onSuccess).withUserObject(cities).populate();

  //Create the dropdown menu for the cities

  for (city in cities) {
    var element = $("#city1").append("<option value=" + cities[city].toLowerCase() + ">" + cities[city] + "</option>");
    console.log(city);
  };

  [...]

});

HTML：

<select id="city1" name="city" placeholder="City"><option id="citydummy">City</option></select>

Google Apps脚本：

function populate() {
  var db = SpreadsheetApp.openById('SHEETID');
  var check = true;
  var array = [];
  for (var i = 2; i < db.getLastRow(); i++) {
    db.getActiveSheet().getRange(i, "1").getValue()
    array.push(db.getActiveSheet().getRange(i, "1").getValue())
  }
  return array;
}

非常感谢任何有贡献的人！

Answer 1

JS的以下修改怎么样？ HTML和GAS不会被修改。在populate()获得的数据会直接发送到onSuccess()，并将数据导入列表。

JS：

$(function() {
  google.script.run.withSuccessHandler(onSuccess).populate();
});

function onSuccess(cities) {
  for (city in cities) {
    var element = $("#city1").append("<option value=" + cities[city].toLowerCase() + ">" + cities[city] + "</option>");
    console.log(city);
  };
};

如果我误解了你的情况，我很抱歉。

加载HTML页面时未填充数组

1 个答案:

JS：