Google Apps脚本切换html文件 [英] Google Apps Script switching html files

查看:132
本文介绍了Google Apps脚本切换html文件的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想知道Google Apps脚本是否可以显示一个HTML文件的内容 返回HtmlService.createHtmlOutputFromFile('0'); ,在文件中有一个按钮,当按下该按钮时,它将导致屏幕清除当前信息,并用第二个html文件替换其自身..................................................................................................................... 返回HtmlService.createHtmlOutputFromFile('1'); . *请注意,我不想链接到google文档或另一个网页.只是想知道您是否可以在同一脚本文档中的html文件之间切换.如果可能的话,我的理由是要有一个菜单"页面,该页面将显示不同的主题,并将所有内容保持在一个文档中,以使其更有条理.

I'm wondering if it is possible with google apps script to display the contents of one html file return HtmlService.createHtmlOutputFromFile('0'); , within the file have a button, and when the button is pressed it will cause the screen to erase the current information and replace itself with a second html file return HtmlService.createHtmlOutputFromFile('1'); . *note I am NOT wanting to link to a google document nor another webpage. Simply wanting to know if you can switch between html files within the same script document. If it is possible, my reasoning is to have a "menu" page that will display different topics and keep everthing in one document to be more organized.

推荐答案

在某种程度上是可能的.我们将暗示有一个功能,可以从HTML文件中获取信息,然后将其写在页面上.如果要能够导航,则每个拥有的.html文件必须在<script></script>

It's possible to an extent. We will imply have a function to grab the information from an HTML file and then write it on the page. If you want to be able to navigate, then each .html file you have must have the following function in the <script></script>

function changePage(page) {
    document.open();   //should work fine without this
    document.write(page);
    document.close();  //should work fine without this
}

此位将处理使用新内容更改整个页面的内容.现在,我们需要以某种方式获取该内容.这将通过Google脚本中.gs文件内部的函数来完成,该函数如下所示:

this bit will handle changing the content of the entire page with new content. Now we need to get that content somehow. This will be done with a function inside of a .gs file in your Google Script that looks like this

function newPage(page) {
  return HtmlService.createHtmlOutputFromFile(page).getContent()
}

然后在页面内部,每当要更改为新页面时,都需要一个按钮:

Then inside of your page, whenever you want to change to a new one you need to have let's say a button:

<button onclick="google.script.run.withSuccessHandler(changePage).newPage('success')">Next Page</button>

在这种情况下,newPage()函数需要一个字符串,该字符串将说明html的名称是什么.因此,遵循逻辑,我们将做

In this case the newPage() function expects a string that will say what is the name of the html. So following the logic we will do

return HtmlService.createHtmlOutputFromFile('success').getContent()`

一旦我们按下该按钮,脚本执行完毕并返回所需的HTML字符串后,便可以使用它来设置当前页面的HTML.

once we press that button and once that script finishes and returns the string of an HTML we want, we then use that to set the HTML of the current page.

这里是如何工作的完整示例.您可以在Index.htmlsuccess.html

Here is the full example of how it would work. You can navigate between Index.html and success.html

Code.gs

function doGet() {
  return HtmlService.createHtmlOutputFromFile('Index');
}

function newPage(page) {
  return HtmlService.createHtmlOutputFromFile(page).getContent()
}

Index.html

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>

  <script>  
  function changePage(page) {
    document.open();
    document.write(page);
    document.close();
  }
  </script>

  <body>
  First Page
    <button onclick="google.script.run.withSuccessHandler(changePage).newPage('success')">Next Page</button>
  </body>
</html>

success.html

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>  
  <script>  
  function changePage(page) {
    document.open();
    document.write(page);
    document.close();
  }
  </script>
  <body>
    It worked!
    <button onclick="google.script.run.withSuccessHandler(changePage).newPage('Index')">First Page</button>
  </body>
</html>

这篇关于Google Apps脚本切换html文件的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆