スクリプトには複数のhtmlファイルを含めることができ、HTML Services: Best PracticesにはHTML、CSS、(クライアント側)のJavaScriptを別々のファイルに保存する必要があります。あなたの場合、index.htmlファイルはすべてHTMLコードになり、いくつかの行が追加されます。
<!DOCTYPE html>
<html>
<head>
<script src="//cdnjs.cloudflare.com/ajax/libs/clipboard.js/1.4.0/clipboard.min.js"></script>
<?!= include('myCSS'); ?>
<title>Give it a Title</title>
</head>
<body>
...
All the Body stuff
...
</body>
<?!= include('myScript'); ?>
</html>
先頭には、ホストされた場所からクリップボードJSを挿入する行があります。私は、clipboard.jsのウェブ検索でそれを見つけました。これは私がclipboard.jsライブラリへのアクセスを取得する場所の行は右この下にあります:サーバー側のファイル(.GSファイル)で
<?!= include('myCSS'); ?>
私は、次のしている私から他のHTMLファイルを含めることができるように私は私のdoGet()関数で読み込む1:
function include(filename) {
return HtmlService.createTemplateFromFile(filename).evaluate()
.getContent();
}
私が鋳型とHTML使用するには、このコードを使用して、私のdoGetメソッドでHTMLをロードしています:あなたが作成するファイルのプルダウンの下
function doGet(passed) {
if(passed.parameter.festival && passed.parameter.year){
passedParameter = passed.parameter.festival + ' ' + passed.parameter.year;
}
var result=HtmlService.createTemplateFromFile('index').evaluate()
.setTitle('My Title')
.setWidth(1285)
.setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL);
return result;
}
を新しいHTMLファイルがmyCSSと呼ばれ、そこにあなたのCSSを追加します。
<style>
h1 {
color: #0F6B5E;
font-size: 300%;
text-align:center;
vertical-align: middle;
font-family: 'Raleway', sans-serif;
font-weight:bold;
padding-top: 0.5em;
padding-bottom: 0.5em;
}
</style>
はあなたがここにあなたのHTMLページで使用したいscreiptとのMyScriptという名前の新しいHTMLファイルを作成し、追加します。これはSErver Sideスクリプトとは対照的にClient Sideスクリプトです。これはすべてScriptファイル内にあります。 (HTMLファイルはファイルのリストに.html拡張子を表示し、サーバー側のスクリプトファイルは.gsを持ちます)calculateWeight()関数を使用してHTMLページのアイテムを計算して表示する場合は、次のファイルに配置します。
google.script.run
で始まる行は、サーバー側機能を実行し、必要に応じて関数に変数を渡します。成功した場合は、withSuccessHandler(successFunction)
に定義されているクライアント側の関数が使用され、返されるデータはすべて渡されます。だから私の例ではshowMenuYear(menuItems)
関数はクライアント側で実行され、menuItemsはサーバー側関数getDropDownContent()
から返された値に設定されています。サーバー側がエラーを返すと、loadFailed(error)
関数が実行されます。これはすべて次の行から来ています。
google.script.run.withSuccessHandler(showMenuYear).withFailureHandler(loadFailed).getDropDownContent();
あなたは素晴らしい教師と問題解決者です!私はあなたの詳細で明確な解決策を持っていることに感謝しています! Thxxxxx! :D –
その答えがどれほど価値があるのかを表現することはできません。ありがとうございました! – deshu