Question

单击“选择模板”项时，我尝试在HTML文件中运行一个函数。我尝试了两种不同的方式，但它们似乎不起作用。我用它来运行onclick =＆＃34; google.script.run.selectTemplate＆＃34;但我想先运行本地函数。

<!DOCTYPE html>
<html>
<head>
  <base target="_top">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">

  <script defer src="https://use.fontawesome.com/releases/v5.0.6/js/all.js"></script>
</head>
<body>
    <div class="content">
      <div class="card mb-4 box-shadow">
        <div class="card-body">
          <h5 class="card-title">Welcome!</h5>
          <p class="card-text">Please select the template that you'd like to fill with form responses!</p>
          <div class="list-group mb-4">
            <div id="select-template" onclick="runSelectTemplate();" class="list-group-item list-group-item-action">Select Template 
              <i class="fas fa-circle-notch fa-spin float-right" style="font-size:24px"></i>
            </div>
          </div>
          <button type="button" id="get-started" class="btn btn-lg btn-block btn-primary" disabled>Get Started</button>
        </div>
      </div>
    </div>

    <script>
      $(function() {
        log("Setting up sidebar clicking...");
        $('#select-template').click(runSelectTemplate);
      });

      function runSelectTemplate(){
        log("Select Template clicked... run selectTemplate()");
        //Do stuff here first, then;
        google.script.run.selectTemplate(); //success: change icon to green -> enable getstarted button  //error: icon to X then back to file
      }
    </script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
    <script src="http://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
</body>
</html>

更新：我已尝试将select-template元素更新为按钮，但它也无效...... <script>部分似乎根本无法运行。

<button type="button" id="select-template" class="btn btn-med btn-block btn-outline-primary mt-4 mb-4">1. Select Template
    <i class="far fa-file-alt float-right" style="font-size:24px"></i>
</button>
<button type="button" id="get-started" class="btn btn-lg btn-block btn-primary" disabled>Get Started</button>

Answer 1

看起来我犯了一个愚蠢的错误......我的jQuery脚本标签位于Body标签的底部，所以它没有立即加载。

<head>
  <base target="_top">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">

  <script defer src="https://use.fontawesome.com/releases/v5.0.6/js/all.js"</script>
  <script src="http://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
</head>

Google Apps脚本边栏 - 如何设置onclick？

1 个答案: