Sidebar.html

Question

我有一些Google表格应用程序脚本代码，可以访问API并根据某些用户输入更新侧边栏中的字段。除了用于从侧边栏触发API调用的按钮之外，一切都按预期工作。出于某种原因，单击该按钮会在浏览器中打开一个新的空白选项卡。

我最好的猜测是我在某种程度上错误地实施了google.script.run.withSuccessHandler()，但我无法证实这一点。任何帮助将不胜感激。

Sidebar.html

这是我正在使用的完整侧边栏文件。

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
    <link rel="stylesheet" href="https://ssl.gstatic.com/docs/script/css/add-ons1.css">
  </head>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script>
      $(function() {
        $('#narrative-from-selection').click(getNarrative);
      });
      function getNarrative(narrative) {
        //document.getElementById('narrative-response').innerHTML = narrative.replace(new RegExp('\r?\n','g'), '<br />');
        var projectName = $('#project-name').val();
        var templateName = $('#template-name').val();
        google.script.run
          .withSuccessHandler(
            function(narrative) {
              $('#narrative-response').html(narrative);
            })
          .withUserObject(this)
          .generateContentForSelected(projectName, templateName);
      }
    </script>
  <body>
    <div>
    <br />
    <br />
    <form>
      Project Name: <input type="text" name="project-name" id="project-name" onchange="google.script.run.updateProjectAndTemplateNames(this.parentNode)"><br />
      Template Name: <input type="text" name="template-name" id="template-name" onchange="google.script.run.updateProjectAndTemplateNames(this.parentNode)"><br />
      <button id="narrative-from-selection">Generate from Selection</button><br /><br />
      Response:<br /><br />
      <div id="narrative-response"></div>
    </form>
    </div>
  </body>
</html>

Code.gs

以下是我正在使用的相关功能的概述（用于命中API的信息已被删除，但我已经多次测试了该部分并且它返回了我期望它发回的内容）。

function generateContentForSelected(projectName, templateName) {
  // go do some API magic here
  var narrative = "This is a test string.";
  return narrative;
}

Answer 1

通过大量的反复试验，我弄清楚是什么导致了这个问题，尽管我仍然不确定为什么它会导致新标签打开。显然，关于app脚本使用表单进行异步调用的方式有点古怪。我从Sidebar.html文件中删除了<form>和</form>标记，一切都按预期工作。

如果有更好的方法来纠正这个问题，或者如果我从一开始就认识到这一切都是错误的，我会有兴趣知道如何更有效地构建它。但是，我确实至少让它发挥作用。

GAS - 阻止按钮单击事件打开新的浏览器选项卡

Sidebar.html

Code.gs

1 个答案: