假设您已经为 Google 表格构建了一个插件,它向表格 UI 添加了一个新菜单项。您现在想在菜单中添加一个选项,单击该选项后,用户无需单击任何其他按钮即可将用户重定向到您的网站。
例如,在这个演示 Google Sheet中,我们有一个父菜单和一个在新窗口中打开基础网站的子菜单。
1. 在 Google 表格中添加菜单
作为第一步,我们将在 Google 表格中添加一个自定义菜单并从onOpen
函数中调用它,这样当用户打开您的 Google 表格时该菜单始终可用。
const onOpen = ( ) => { const ui = SpreadsheetApp . getUi ( ) ; const parentMenu = ui . createMenu ( '??? Digital Inspiration' ) ; parentMenu . addItem ( 'Visit our website' , 'openWebsite' ) ; parentMenu . addToUi ( ) ; } ;
2.为网站重定向添加HTML
在 Apps 脚本编辑器中创建一个新文件url.html
并添加以下代码。
JavaScript 使用window.open
方法在新窗口中打开 URL,因为我们已将目标设置为_blank
。
<! DOCTYPE html > < html > < body > < a href = " <?= url; ?> " target = " _blank " > Click here </ a > to open the webpage. </ body > < script > var windowReference = window . open ( '<?= url; ?>' , '_blank' ) ; if ( windowReference !== null ) { google . script . host . close ( ) ; } </ script > </ html >
在弹出窗口中打开窗口
如果您想以固定大小的弹出窗口而不是新窗口打开网站,则该函数将编写为:
< script > var windowFeatures = 'popup' ; var windowReference = window . open ( '<?= url; ?>' , 'scriptWindow' , windowFeatures ) ; if ( windowReference !== null ) { google . script . host . close ( ) ; } </ script >
如果窗口已被浏览器内置的弹出窗口阻止程序阻止,则window.open
方法的返回值为 null。
弹出窗口可以放置在脚本上的任何位置,并通过修改 windowFeatures 变量调整为特定的高度和宽度,如下所示:
// before var windowFeatures = 'popup' ; // after var windowFeatures = 'left=100,top=100,width=320,height=320' ;
有关解决与打开辅助窗口的链接相关的一些可用性问题的最佳实践,请参阅MDN 文档。
3.从谷歌表格打开链接
接下来,我们将编写将从菜单调用的 Apps 脚本函数,并在新窗口/选项卡中启动网站。
const openWebsite = ( ) => { const htmlTemplate = HtmlService . createTemplateFromFile ( 'url.html' ) ; htmlTemplate . url = 'https://digitalinspiration.com/' ; const htmlOutput = htmlTemplate . evaluate ( ) . setHeight ( 50 ) . setWidth ( 200 ) ; const ui = SpreadsheetApp . getUi ( ) ; ui . showModelessDialog ( htmlOutput , 'Open Website' ) ; Utilities . sleep ( 2000 ) ; } ;
需要添加sleep
功能,因为打开窗口可能需要一两秒钟。如果省略sleep
,则电子表格对话框将打开并立即关闭,而无需启动网站。
原文: https://www.labnol.org/open-webpage-google-sheets-220507