博主：添加了 Javascript 但没有结果答案

【问题标题】：Blogger: Added Javascript but no result came out博主：添加了 Javascript 但没有结果
【发布时间】：2016-08-28 09:24:01
【问题描述】：

首先我编辑了我的 Blogger 模板 HTML。

我在 footer-1 部分添加了以下脚本：

<script type="text/javascript">
//<![CDATA[
var copyTextareaBtn = document.querySelector('.js-textareacopybtn');
copyTextareaBtn.addEventListener('click', function(event) {
  var copyTextarea = document.querySelector('.js-copytextarea');
  copyTextarea.select();
});
var copyTextareaBtnb = document.querySelector('.js-textareacopybtnb');
copyTextareaBtnb.addEventListener('click', function(event) {
  var copyTextarea = document.querySelector('.js-copytextareab');
  copyTextarea.select();
});
//]]>
</script>

接下来我添加了一个带有以下 HTML 的博客：

<textarea class="js-copytextarea">text needed to copy</textarea>    
<button class="js-textareacopybtn">
<img src="https://clipboardjs.com/assets/images/clippy.svg" width="13" alt="Copy to clipboard">
</button>
<textarea class="js-copytextareab">text 2 needed to copy</textarea>    
<button class="js-textareacopybtnb">
<img src="https://clipboardjs.com/assets/images/clippy.svg" width="13" alt="Copy to clipboard">
</button>

然后我点击了第一个和第二个按钮，没有复制任何内容。

【问题讨论】：

I added the following script in the <head> tag: - 你的问题...copyTextareaBtn 将是未定义的，因为按钮尚未呈现 - 你应该在你的开发者工具控制台中看到错误，这会很有用问题中的信息
正如我所说，因为您在页面加载之前运行 javascript
我解决了第一个问题。我的第二个问题是如何使它加倍。我改变了变量，它就像第一个一样变得更糟。

标签： javascript html clipboard blogger

【解决方案1】：

将所有代码放在一处（例如，<div> 或 HTML 小部件）。对于 Blogger 中的脚本，请使用以下结构：

<script type="text/javascript">
//<![CDATA[
your js code here
//]]>
</script>

【讨论】：

【解决方案2】：

您需要为 JavaScript 包含 jQuery。将此代码放在<head/>之前

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

【讨论】：

【解决方案3】：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<textarea class="js-copytextarea" id="1" readonly="" style="font-family: courier;">TTTEXTTT</textarea><button class="js-textareacopybtn" data-id="1">CCCOPYYY</button>
<script>
$('.js-textareacopybtn').on('click', function(event) {
  var copyTextarea = $(this).data('id');
  $('#' + copyTextarea)[0].select();
  document.execCommand('copy');
});
</script>

【讨论】：