选择文本并在纯JavaScript中聚焦特定文本区域时将其复制到剪贴板?

时间:2019-01-15 06:07:33

标签: javascript

我的页面上有很多文本区域

<textarea onClick="copyToClipboard(this);">mobile</textarea>
<textarea onClick="copyToClipboard(this);">computer</textarea>
<textarea onClick="copyToClipboard(this);">chair</textarea>
.
.
.

我想选择文本并在不使用任何库的情况下将文本区域放在纯JavaScript中时复制到剪贴板。

我的js代码是

function copyToClipboard()
{
   this.select(); // I don't know how to select in JavaScript
   document.execCommand("copy");

}

2 个答案:

答案 0 :(得分:1)

您将使用带有纯Javascript的window.getSelection()函数获得所选文本。

  

我已根据您的要求编辑了代码。要获取所有选定的文本区域内容,请使用select()函数。

function copyToClipboard(elem) {
console.log(elem.value)
 elem.focus();
 elem.select();

document.getElementById('text').innerHTML = window.getSelection();
document.execCommand("copy");
}
<textarea class onClick="copyToClipboard(this)">Computer</textarea>
<textarea class onClick="copyToClipboard(this)">Mouse</textarea>
<textarea class onClick="copyToClipboard(this)">Keyboard</textarea>

<p id="text"></p>

答案 1 :(得分:1)

尝试一下:

var el = document.querySelectorAll('textarea');

for (var i = 0; i < el.length; i++) {
  el[i].addEventListener('click', (e) => {
    e.target.select();
    document.execCommand("copy");
  });
}
<textarea>mobile</textarea>
<textarea>computer</textarea>
<textarea>chair</textarea>