如何从 google appscript 中的另一个 html 页面调用另一个 HTML 页面答案

【问题标题】：How can I call another HTML page from another html page in google appscript如何从 google appscript 中的另一个 html 页面调用另一个 HTML 页面
【发布时间】：2021-02-12 07:23:14
【问题描述】：

我在我的项目中创建了两个页面，分别命名为“Input.html”和“output.html”，其中单击 input.html 中的提交按钮时，输出将在 output.html 中打印

但是我不知道如何从一个页面调用另一个页面

代码.gs

function doGet() {
  return HtmlService.createTemplateFromFile('Input')
      .evaluate().setTitle("GL StyleGuide").setFaviconUrl("https://fonts.ab24dp.png");
}

在输入页面中有一个文本区域和一个单击提交按钮，我希望我的输出在 output.html 页面上打印。修改：Input.html的示例html如下

<div>
  <label id="label">Please Enter CSS</label>
      <textarea id="input-textarea"></textarea>
      
      <?var url = ScriptApp.getService().getUrl();?><a href='<?=url?>?v=form'><input type='button' id="submit" name='button' onclick="addRow()" value='Get Style Guide'></a>      
</div>

【问题讨论】：

能否提供Input.html的示例脚本？
是的，你能提供一个Minimal Reproducible Example 和一些上下文吗？你想做什么？提交表单后将某人重定向到“output.html”？你不能就地修改 HTML 吗？
@Tanaike 修改了我的问题
感谢您回复并添加更多信息。现在，我注意到已经发布了答案。在这种情况下，我想尊重现有的答案。
@kanupriya 下面的答案不能回答您的问题吗？我仍然对您要做什么感到困惑。例如，您是尝试使用打印机打印还是在屏幕上打印？

标签： javascript html css google-apps-script

【解决方案1】：

所以我在我的一个网络应用程序中使用的一种方法是我有一个 <div id = "app"></div> 在我想要加载另一个 HTML 的页面中。

然后我有这个函数来评估我的视图代码.gs

function loadPartialHTML_(params) {
  var htmlSrv = HtmlService.createTemplateFromFile(params);
  var html = htmlSrv.evaluate().getContent();
  return html;
}

然后在我的主 Html 中，我有这个函数，它接受 myView Html 并将其填充到定义的 div 中。

function loadView(options){ //loadView Function to Access Server side functions with options being an object of Parameter


var id = typeof options.id === "undefined" ? "app" : options.id; //checking if Id of Element is undefined then "app" will be used else parameter passed

var cb = typeof options.callback === "undefined" ? function(){} : options.callback; //if undefined then a blank function else function called

google.script.run.withFailureHandler(function (e){
    displayToast("errorNotification",e.message);
    loadingEnd();
}).withSuccessHandler(function(html){ //accessing server side function which will be supplied in object with "func:" which will return HTML

document.getElementById(id).innerHTML = html; //this is a call back funtion which gets html from server side and setting defined element to that return

typeof options.params === "undefined" ? cb() : cb(options.params); //if parameters were not supplied thn callback funtion with parameters else with parameters
})[options.func]();
}

myView HTML 将是一个只有元素的 HTML 文件，没有标题、正文等。

您可以使用事件处理程序在事件发生后加载视图。此外，这不是我的工作，我从一个很棒的 Youtube 频道学到了这个策略的链接，以防你被困在某个地方：https://www.youtube.com/watch?v=6zFowiTNhqI&t=1476s

【讨论】：