如何将html变量传递给htmlservice

时间:2014-06-12 17:11:22

标签: google-apps-script

我正在尝试动态构建列表并将其嵌入到html脚本中。下面脚本的问题是我传递的htmlimg值没有读取html代码标记,只是在网站上显示代码。

Code.gs

function doGet() {

  var htmlimg = '<img src="http://www.fhuhs.org/files/slide1.png">';
  htmlimg += '<img src="http://www.fhuhs.org/files/slide2.png">';  
  htmlimg += '<img src="http://www.fhuhs.org/files/slide3.png">';  
  htmlimg += '<img src="http://www.fhuhs.org/files/slide4.png">';  

  var output = HtmlService.createTemplateFromFile('slideShow');
  output.htmlimg = htmlimg;

  return output.evaluate();
}

slideShow.html

 <style>  
 #slideshow, #initial {   
   position: relative;  
   width: 800px;   
   height: 240px;     
 }  
 #slideshow > img {   
   position: absolute;  
 }   
 </style>   
 <div id="initial"> <img src="https://16077c1df3a89c327142d4d58315918890da5bae.googledrive.com/host/0B4GLYStYeHYkRGRTdHl5TVVjOHM/slide1.png"></div>  
 <div id="slideshow" style="display:none">  


<?= htmlimg; ?>

 </div>  
 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"> </script>  
 <script>  
  //http://css-tricks.com/snippets/jquery/simple-auto-playing-slideshow/  
 $("#slideshow > img:gt(0)").hide();  
 setInterval(function() {   
  $('#slideshow > img:first')  
   .fadeOut(1000)  
   .next()  
   .fadeIn(1000)  
   .end()  
   .appendTo('#slideshow');  
 }, 3000);   
 $('#initial').hide();  
 $('#slideshow').show();  
 </script> 

1 个答案:

答案 0 :(得分:0)

你需要调用一个能够返回

的函数

Code.gs

function doGet() {
      var output = HtmlService.createTemplateFromFile('slideShow');
      return output.evaluate();
    }

function getImages() {
  var htmlimg = '<img src="http://www.fhuhs.org/files/slide1.png">';
  htmlimg += '<img src="http://www.fhuhs.org/files/slide2.png">';  
  htmlimg += '<img src="http://www.fhuhs.org/files/slide3.png">';  
  htmlimg += '<img src="http://www.fhuhs.org/files/slide4.png">';
  return htmlimg;
}

slideshow.html

<div>
  <? var images = getImages(); ?>
  <?= images ?>
</div>