使用Google的“`Apps”在Sidebar中创建一个复制到剪贴板按钮
有没有办法使用Google的Apps Script创建边栏中的复制剪贴板按钮
我的当前代码如下所示，但“复制”按钮无法工作：
function createCalendarEvent() {
var html = HtmlService.createHtmlOutput()
.setTitle("Πληροφορίες για Ημερολόγιο")
.setContent('<div><p id="item-to-copy">Test</p>' + '\n\n<button onclick='+"copyToClipboard()"+'>Copy</button></div>')
var ui = SpreadsheetApp.getUi(); // Or DocumentApp or SlidesApp or FormApp.
ui.showSidebar(html);
}
function copyToClipboard() {
const str = document.getElementById('item-to-copy').innerText;
const el = document.createElement('textarea');
el.value = str;
el.setAttribute('readonly', '');
el.style.position = 'absolute';
el.style.left = '-9999px';
document.body.appendChild(el);
el.select();
document.execCommand('copy');document.body.removeChild(el)；}
第二个函数是javascipt。
你能帮帮我吗？
编辑当我在浏览器上单击F12时，会得到以下错误：
Uncaught ReferenceError: copyToClipboard is not defined
at HTMLButtonElement.onclick (userCodeAppPanel:1)
onclick @ userCodeAppPanel:1
回答 1
Stack Overflow用户
发布于 2020-12-30 17:11:38
修改要点：
- 在
The second function is javascipt.中，如果将copyToClipboard()放到脚本编辑器的HTML中，在这种情况下，脚本中的html不包含该函数。这样，就会发生这样的错误。 - 或者，如果将
copyToClipboard()放到脚本编辑器的Google脚本文件中，则copyToClipboard()不能从HTML运行。这样，就会发生这样的错误。
为了运行copyToClipboard()，我建议进行以下修改。
修改脚本：
HTML和Javascript方面：
请将以下脚本复制并粘贴到Google脚本项目中脚本编辑器的HTML文件中。文件名为index.html。
<div>
<p id="item-to-copy">Test</p>
<button onclick="copyToClipboard()">Copy</button>
</div>
<script>
function copyToClipboard() {
const str = document.getElementById('item-to-copy').innerText;
const el = document.createElement('textarea');
el.value = str;
el.setAttribute('readonly', '');
el.style.position = 'absolute';
el.style.left = '-9999px';
document.body.appendChild(el);
el.select();
document.execCommand('copy');
document.body.removeChild(el);
}
</script>Google脚本端：
请将以下脚本复制并粘贴到Google脚本项目中脚本编辑器的Google脚本文件中。
function createCalendarEvent() {
var html = HtmlService.createHtmlOutputFromFile("index").setTitle("Πληροφορίες για Ημερολόγιο")
var ui = SpreadsheetApp.getUi(); // Or DocumentApp or SlidesApp or FormApp.
ui.showSidebar(html);
}- 运行
createCalendarEvent()时，脚本将从index.html文件加载HTML & Javascript。
注意：
- 如果要使用
setContent，还可以使用以下脚本。
- HTML&Javascript side:HtmlService.createHtmlOutputFromFile("index").getContent()；函数createCalendarEvent() { var javascript = htmlData = <div><p id="item-to-copy">Test</p><button onclick="copyToClipboard()">Copy</button></div>${javascript}；var html = HtmlService.createHtmlOutput() .setTitle(“ΠληροφορίεςγιαΗμερολόγιο”) .setContent(htmlData) var ui = SpreadsheetApp.getUi()；//或DocumentApp或SlidesApp或FormApp。ui.showSidebar(html)；}
参考文献：
https://stackoverflow.com/questions/65515143
复制
腾讯云开发者
