Javascript Google Web App onload脚本无法处理HTML输出_Javascript_Web Applications_Google Apps Script

Javascript Google Web App onload脚本无法处理HTML输出

javascript web-applications google-apps-script

Javascript Google Web App onload脚本无法处理HTML输出,javascript,web-applications,google-apps-script,Javascript,Web Applications,Google Apps Script,我有一个code.gs文件服务于一个HTML文件，其中包含一个onload函数和一个触发同一文件中另一个函数的按钮。当我点击按钮时，onclick事件不会被触发，当访问web应用程序时，onload函数也不会被触发 function doGet() { var html = HtmlService.createHtmlOutputFromFile('Index'); html.setSandboxMode(HtmlService.SandboxMode.IFRAME) htm

我有一个code.gs文件服务于一个HTML文件，其中包含一个onload函数和一个触发同一文件中另一个函数的按钮。当我点击按钮时，onclick事件不会被触发，当访问web应用程序时，onload函数也不会被触发

    function doGet() {

   var html = HtmlService.createHtmlOutputFromFile('Index');
html.setSandboxMode(HtmlService.SandboxMode.IFRAME)  
html.setWidth(800);
  html.setHeight(400);



  return html;
}

function populate1(){


  //CHANGE spreadsheet ID
var a = SpreadsheetApp.openById("1ea4hkN48Tu9M9y03e_Xrxp_s8hk882UzzOVtk4HVRlE");

  //sheets
  var ERsheet = a.getSheetByName("Equipment request");
  var TRsheet = a.getSheetByName("Troubleshooting");
  var OTsheet = a.getSheetByName("Other requests");

  //lrs
  var ERlr = ERsheet.getLastRow();
  var TRlr = TRsheet.getLastRow();
  var OTlr = OTsheet.getLastRow();

  //lrs 2
  var ERlr2 = (ERsheet.getLastRow() - 1);
  var TRlr2 = (TRsheet.getLastRow() - 1);
  var OTlr2 = (OTsheet.getLastRow() - 1);

  //lrs 3
  var ERlr3 = (ERsheet.getLastRow() - 2);
  var TRlr3 = (TRsheet.getLastRow() - 2);
  var OTlr3 = (OTsheet.getLastRow() - 2);



  //copyranges

  //ER
  var ERcro11 = ERsheet.getRange(ERlr, 1, 1, 1).getValue();
   var ERcro12 = ERsheet.getRange(ERlr, 2, 1, 1).getValue();
    var ERcro13 = ERsheet.getRange(ERlr, 3, 1, 1).getValue();
     var ERcrd1 = ERsheet.getRange(ERlr, 5, 1, 1).getValue();
  var ERcro21 = ERsheet.getRange(ERlr2, 1, 1, 1).getValue();
   var ERcro22 = ERsheet.getRange(ERlr2, 2, 1, 1).getValue();
    var ERcro23 = ERsheet.getRange(ERlr2, 3, 1, 1).getValue();
     var ERcrd2 = ERsheet.getRange(ERlr2, 5, 1, 1).getValue();
  var ERcro31 = ERsheet.getRange(ERlr3, 1, 1, 1).getValue();
   var ERcro32 = ERsheet.getRange(ERlr3, 2, 1, 1).getValue();
    var ERcro33 = ERsheet.getRange(ERlr3, 3, 1, 1).getValue();
     var ERcrd3 = ERsheet.getRange(ERlr3, 5, 1, 1).getValue();

  //TR
  var TRcro11 = TRsheet.getRange(TRlr, 1, 1, 1).getValue();
   var TRcro12 = TRsheet.getRange(TRlr, 2, 1, 1).getValue();
    var TRcro13 = TRsheet.getRange(TRlr, 3, 1, 1).getValue();
     var TRcr1 = TRsheet.getRange(TRlr, 5, 1, 1).getValue();
  var TRcro21 = TRsheet.getRange(TRlr2, 1, 1, 1).getValue();
   var TRcro22 = TRsheet.getRange(TRlr2, 2, 1, 1).getValue();
    var TRcro23 = TRsheet.getRange(TRlr2, 3, 1, 1).getValue();
     var TRcr2 = TRsheet.getRange(TRlr2, 5, 1, 1).getValue();
  var TRcro31 = TRsheet.getRange(TRlr3, 1, 1, 1).getValue();
   var TRcro32 = TRsheet.getRange(TRlr3, 2, 1, 1).getValue();
    var TRcro33 = TRsheet.getRange(TRlr3, 3, 1, 1).getValue();
     var TRcr3 = TRsheet.getRange(TRlr3, 5, 1, 1).getValue();

  //OT
  var OTcro1 = OTsheet.getRange(OTlr, 1, 1, 1).getValue();
   var OTcro1 = OTsheet.getRange(OTlr, 2, 1, 1).getValue();
    var OTcro1 = OTsheet.getRange(OTlr, 3, 1, 1).getValue();
     var OTcr1 = TRsheet.getRange(OTlr, 5, 1, 1).getValue(); 
  var OTcro2 = OTsheet.getRange(OTlr2, 1, 1, 1).getValue();
   var OTcro2 = OTsheet.getRange(OTlr2, 2, 1, 1).getValue();
    var OTcro2 = OTsheet.getRange(OTlr2, 3, 1, 1).getValue();
     var OTcr2 = TRsheet.getRange(OTlr2, 5, 1, 1).getValue();   
  var OTcro3 = OTsheet.getRange(OTlr3, 1, 1, 1).getValue();
   var OTcro3 = OTsheet.getRange(OTlr3, 2, 1, 1).getValue();
    var OTcro3 = OTsheet.getRange(OTlr3, 3, 1, 1).getValue();
     var OTcr3 = TRsheet.getRange(OTlr3, 5, 1, 1).getValue(); 


  var g = 0;
  //JSONArray jsarray = new JSONArray();

// var json = [
 //  {"ERc1c1":ERcro11, "ERc1c2":ERcrd1}, 
 //   {"ERc2c1":ERcro21, "ERc2c2":ERcrd2}, 
 //   {"ERc3c1":ERcro31, "ERc3c2":ERcrd3}
 //  ];


  return (ERcro11, ERcro12, ERcro13, ERcrd1,
          ERcro21, ERcro22, ERcro23, ERcrd2,
          ERcro31, ERcro32, ERcro33, ERcrd3);





      }

代码提供Index.HTML，它是下面的文件

    <!DOCTYPE html>
<html>
  <head>
    <base target="_top">
<style> 
tablestats{
align: right;
right-padding: 20px;
padding: 20px;
}
body{
border: 5px;

}

</style>
<script src="https://apis.google.com/js/api.js?onload=onApiLoad">
</script>
    <script>
function filler1(ERcro11, ERcro12, ERcro13, ERcrd1,
          ERcro21, ERcro22, ERcro23, ERcrd2,
          ERcro31, ERcro32, ERcro33, ERcrd3){






//dates
//var date1 = document.getElementByID("date1").innerHTML = ERcro11;
//var date2 = document.getElementByID("date2").innerHTML = ERcro21;
//var date3 = document.getElementByID("date3").innerHTML = ERcro31;
//var date4 = document.getElementByID("date4").innerHTML = ;
//var date5 = document.getElementByID("date5").innerHTML = ;
//var date6 = document.getElementByID("date6").innerHTML = ;
//var date7 = document.getElementByID("date7").innerHTML = ;
//var date8 = document.getElementByID("date8").innerHTML = ;
//var date9 = document.getElementByID("date9").innerHTML = ;

//senders
//var sender1 = document.getElementByID("sender1").innerHTML = ERcro12;
//var sender2 = document.getElementByID("sender2").innerHTML = ERcro22;
//var sender3 = document.getElementByID("sender3").innerHTML = ERcro32;
//var sender4 = document.getElementByID("sender4").innerHTML = ;
//var sender5 = document.getElementByID("sender5").innerHTML = ;
//var sender6 = document.getElementByID("sender6").innerHTML = ;
//var sender7 = document.getElementByID("sender7").innerHTML = ;
//var sender8 = document.getElementByID("sender8").innerHTML = ;
//var sender9 = document.getElementByID("sender9").innerHTML = ;

//types
//var type1 = document.getElementByID("type1").innerHTML = ERcrd1;
//var type2 = document.getElementByID("type2").innerHTML = ERcrd2;
//var type3 = document.getElementByID("type3").innerHTML = ERcrd3;
//var type4 = document.getElementByID("type4").innerHTML = ;
//var type5 = document.getElementByID("type5").innerHTML = ;
//var type6 = document.getElementByID("type6").innerHTML = ;
//var type7 = document.getElementByID("type7").innerHTML = ;
//var type8 = document.getElementByID("type8").innerHTML = ;
//var type9 = document.getElementByID("type9").innerHTML = ;

//duedates
document.getElementByID("request1").innerHTML = "hola";
//var duedate2 = document.getElementByID("request2").innerHTML = ;
//var duedate3 = document.getElementByID("request3").innerHTML = ;
//var duedate4 = document.getElementByID("request4").innerHTML = ;
//var duedate5 = document.getElementByID("request5").innerHTML = ;
//var duedate6 = document.getElementByID("request6").innerHTML = ;
//var duedate7 = document.getElementByID("request7").innerHTML = ;
//var duedate8 = document.getElementByID("request8").innerHTML = ;
//var duedate9 = document.getElementByID("request9").innerHTML = ;


}

function trigger(){

google.script.run.withsuccesshandler(filler1).populate1();



}

function testfunc(){

document.getElementByID("date1").innerHTML = "test";


}


<?!= include('script_js'); ?>
</script>
  </head>



  <body onload="testfunc()">


<table width="40%" class="tablestats">
                    <thead>
                        <tr>
                            <th>Date</th>
                            <th>Email</th>
                            <th>Phone</th>
                            <th>Mobile</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr><td class="Date" id="date1">x</td><td class="sender" id="sender1">x</td><td class="Type" id="type1" >x</td><td class="due date1" id="request1">x</td></tr>
                        <tr><td class="Date" id="date2">x</td><td class="sender" id="sender2">x</td><td class="Type" id="type2" >x</td><td class="due date" id="request2">x</td></tr>
                        <tr><td class="Date" id="date3">x</td><td class="sender" id="sender3">x</td><td class="Type" id="type3" >x</td><td class="due date" id="request3">x</td></tr>
                        <tr><td class="Date" id="date4">x</td><td class="sender" id="sender4">x</td><td class="Type" id="type4" >x</td><td class="due date" id="request4">x</td></tr>
                        <tr><td class="Date" id="date5">x</td><td class="sender" id="sender5">x</td><td class="Type" id="type5" >x</td><td class="due date" id="request5">x</td></tr>
                        <tr><td class="Date" id="date6">x</td><td class="sender" id="sender6">x</td><td class="Type" id="type6" >x</td><td class="due date" id="request6">x</td></tr>
                        <tr><td class="Date" id="date7">x</td><td class="sender" id="sender7">x</td><td class="Type" id="type7" >x</td><td class="due date" id="request7">x</td></tr>
                        <tr><td class="Date" id="date8">x</td><td class="sender" id="sender8">x</td><td class="Type" id="type8" >x</td><td class="due date" id="request8">x</td></tr>
                        <tr><td class="Date" id="date9">x</td><td class="sender" id="sender9">x</td><td class="Type" id="type9" >x</td><td class="due date" id="request9">x</td></tr>
                    </tbody>
                </table>
<!--<input type="button" onclick="testfunc()"> Populate </input> -->
<button onclick="testfunc()">Click me</button>



  </body>
</html>


表状态{
对齐：右；
右填充：20px；
填充：20px；
}
身体{
边界：5px；
}
函数填充器1（ERcro11、ERcro12、ERcro13、ERcrd1、，
ERcro21、ERcro22、ERcro23、ERcrd2、，
ERcro31、ERcro32、ERcro33、ERcrd3）{
//日期
//var date1=document.getElementByID（“date1”）.innerHTML=ERcro11；
//var date2=document.getElementByID（“date2”）.innerHTML=ERcro21；
//var date3=document.getElementByID（“date3”）.innerHTML=ERcro31；
//var date4=document.getElementByID（“date4”）.innerHTML=；
//var date5=document.getElementByID（“date5”）.innerHTML=；
//var date6=document.getElementByID（“date6”）.innerHTML=；
//var date7=document.getElementByID（“date7”）.innerHTML=；
//var date8=document.getElementByID（“date8”）.innerHTML=；
//var date9=document.getElementByID（“date9”）.innerHTML=；
//寄件人
//var sender1=document.getElementByID（“sender1”）.innerHTML=ERcro12；
//var sender2=document.getElementByID（“sender2”）.innerHTML=ERcro22；
//var sender3=document.getElementByID（“sender3”）.innerHTML=ERcro32；
//var sender4=document.getElementByID（“sender4”）.innerHTML=；
//var sender5=document.getElementByID（“sender5”）.innerHTML=；
//var sender6=document.getElementByID（“sender6”）.innerHTML=；
//var sender7=document.getElementByID（“sender7”）.innerHTML=；
//var sender8=document.getElementByID（“sender8”）.innerHTML=；
//var sender9=document.getElementByID（“sender9”）.innerHTML=；
//类型
//var type1=document.getElementByID（“type1”）.innerHTML=ERcrd1；
//var type2=document.getElementByID（“type2”）.innerHTML=ERcrd2；
//var type3=document.getElementByID（“type3”）.innerHTML=ERcrd3；
//var type4=document.getElementByID（“type4”）.innerHTML=；
//var type5=document.getElementByID（“type5”）.innerHTML=；
//var type6=document.getElementByID（“type6”）.innerHTML=；
//var type7=document.getElementByID（“type7”）.innerHTML=；
//var type8=document.getElementByID（“type8”）.innerHTML=；
//var type9=document.getElementByID（“type9”）.innerHTML=；
//决斗
document.getElementByID（“request1”）.innerHTML=“hola”；
//var duedate2=document.getElementByID（“request2”）.innerHTML=；
//var duedate3=document.getElementByID（“request3”）.innerHTML=；
//var duedate4=document.getElementByID（“request4”）.innerHTML=；
//var duedate5=document.getElementByID（“request5”）.innerHTML=；
//var duedate6=document.getElementByID（“request6”）.innerHTML=；
//var duedate7=document.getElementByID（“request7”）.innerHTML=；
//var duedate8=document.getElementByID（“request8”）.innerHTML=；
//var duedate9=document.getElementByID（“request9”）.innerHTML=；
}
函数触发器（）{
google.script.run.withsuccesshandler（filler1.populate1（）；
}
函数testfunc（）{
document.getElementByID（“date1”）.innerHTML=“test”；
}
日期
电子邮件
电话
可移动的
xxxx
xxxx
xxxx
xxxx
xxxx
xxxx
xxxx
xxxx
xxxx
点击我

我的code.gs文件中是否需要DoPost（e）函数？我不明白为什么HTML文件中设置的脚本文件即使在onclick调用时也没有运行。

您不应该只需要doPost（e）来运行基本上是AJAX的东西。您需要使用google脚本运行程序，以便客户端脚本与应用程序脚本通信

这是有关的参考资料