在模态框 Google 脚本中为 Textarea 提供尺寸答案

【问题标题】：Give dimensions to Textarea in a modal box Google script在模态框 Google 脚本中为 Textarea 提供尺寸
【发布时间】：2020-01-04 12:00:09
【问题描述】：

我正在尝试为模态框中的 Textarea 提供尺寸。

从这里 Add content of showModalDialog() to the clipboard Google Script

HTML 是

<textarea id="copy"><?=temp?></textarea>
<button>Copy</button>
<script type="text/javascript">
   let t = document.getElementById('copy');
   let copy = () => {
     t.select();
     document.execCommand('copy');
   };
  /*copy();//try copying without user click */
  let bt = document.querySelector('button');
  bt.addEventListener('click', copy);

 </script>

我可以给模态框指定尺寸

//Output to Html
var template = HtmlService.createTemplateFromFile('copy');
template.temp = temp;
var htmlOutput = template.evaluate();
               htmlOutput.setWidth(610)
               htmlOutput.setHeight(500); 
SpreadsheetApp.getUi().showModalDialog(htmlOutput, 'OptionList Multiple Selectors');
}

我试图让 Modal 和 Textarea 的尺寸相同就像现在一样，textarea 大约是 20 x 50。

【问题讨论】：

标签： javascript css google-apps-script modal-dialog

【解决方案1】：

试试这个：

<textarea id="copy" cols="20" rows="50"><?=temp?></textarea>

【讨论】：

【解决方案2】：

您也可以尝试使用 JavaScript 进行设置：

<textarea id="copy"><?=temp?></textarea>
<button style="width:100%">Copy</button>
<script type="text/javascript">
   let t = document.getElementById('copy');
   t.style.height = t.scrollHeight + "px";//or 100%
   t.style.width = "100%"
   let copy = () => {
     t.select();
     document.execCommand('copy');
   };
  /*copy();//try copying without user click */
  let bt = document.querySelector('button');
  bt.addEventListener('click', copy);
 </script>

<textarea id="copy">
filter {
  target: element;
  as: dropdown;
  padding: 5;
  summary: "Network Practice";
  default: show-all;
  multiple: true;

  option {
   label: "< 1 year";
   selector: element["NETWORK PRACTICE"="< 1 year"];
  }
  option {
   label: "1-3 years";
   selector: element["NETWORK PRACTICE"="1-3 years"];
  }
  option {
   label: "3-10 years";
   selector: element["NETWORK PRACTICE"="3-10 years"];
  }
  option {
   label: "> 10 years";
   selector: element["NETWORK PRACTICE"=">10 years"];
  }
 }
</textarea>
<button style="width:100%">Copy</button>
<script type="text/javascript">
   let t = document.getElementById('copy');
   t.style.height = t.scrollHeight +"px";//or 100%
   t.style.width = "100%"
   let copy = () => {
 t.select();
 document.execCommand('copy');
   };
  /*copy();//try copying without user click */
  let bt = document.querySelector('button');
  bt.addEventListener('click', copy);
 </script>

参考资料：

【讨论】：