google-apps-script - 如何使用 HtmlService 创建进度微调器？

Question

在 scriptUi 中，我能够按照以下说明创建一个用于长时间等待的简单进度微调器:https://sites.google.com/site/scriptsexamples/learn-by-example/uiapp-examples-code-snippets/progress-indicators

我现在正在使用 HtmlService 创建 Ui，但我不知道如何像以前那样设置微调器。

Answer 1

我找到了一个方法。诀窍是调用一个内部函数来启动微调器并运行另一个函数。

html

<script>
  function onSuccess() {
    var div = document.getElementById('result');
    div.innerHTML = '<div>Sucess!</div>';
  }

    function onFailure() {
    var div = document.getElementById('result');
    div.innerHTML = '<div>Fail!</div>';
  }
  function clickAction(){
    var div = document.getElementById('result');
    div.innerHTML = '<div> Copying...<br><img src="https://c4a54d10381f750e81dcc323aed21e2c95725815.googledrive.com/host/0Bwyqwd2fAHMMallsNkNOV0RfcTg/wait_progress.gif"></div>';
  google.script.run
  .withSuccessHandler(onSuccess)
  .withFailureHandler(onFailure)
  .testSpinner();
  }

</script>

<button class="action" onclick="clickAction()"> Copy</button>
<button onclick="google.script.host.close()"> Close</button>
<div id='result'></div>

gs文件

function testSpinner(){
 SpreadsheetApp.getActiveSpreadsheet().toast("Copying...","",-1);
  Utilities.sleep(5000);
 SpreadsheetApp.getActiveSpreadsheet().toast("Done.");
}