У меня есть этот JS-код, в котором вы можете просто передать идентификатор элемента, и он скопирует текст из этого элемента. Однако, когда у меня есть несколько фрагментов на странице и я хочу скопировать более одного, это не сработает.
При загрузке первой страницы я могу скопировать один фрагмент, каждый фрагмент после этого копируется неправильно, нужно ли очищать буфер обмена от первого фрагмента?
function copy_snippet(snippet) {
if (document.selection) {
var range = document.body.createTextRange();
range.moveToElementText(document.getElementById(snippet));
range.select().createTextRange();
document.execCommand("copy");
} else if (window.getSelection) {
var range = document.createRange();
range.selectNode(document.getElementById(snippet));
window.getSelection().addRange(range);
document.execCommand("copy");
}
}
<div id = "1">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam et tempus lacus, at congue augue. Vivamus nisl diam, ornare non justo vel, pulvinar gravida magna. Nullam posuere pharetra felis, sit amet viverra ex bibendum ut. Cras hendrerit tempor metus
ut interdum. Suspendisse potenti. Etiam mi nunc, lacinia non justo vel, eleifend lobortis lectus. Morbi nulla diam, volutpat quis mauris ut, ultrices venenatis massa.
</div>
<button onclick = "copy_snippet('1');">Copy</button>
<br /><br />
<div id = "2">
Vestibulum est arcu, porttitor a leo in, rhoncus mattis elit. In hac habitasse platea dictumst. Praesent vitae felis vitae risus ornare mattis. Maecenas ac condimentum lorem. Proin ornare nisi non sapien accumsan, quis suscipit est pellentesque. Sed enim
purus, auctor sit amet tincidunt id, convallis a eros. Aenean a rhoncus orci. Pellentesque consequat ligula tincidunt semper varius.
</div>
<button onclick = "copy_snippet('2');">Copy</button>
Дело не в том, что вам нужно очистить буфер обмена, а в том, что вам нужно очистить выделение. Это описано в этом ответе:
Очистить выделение текста с помощью JavaScript
Я внес изменения в ваш фрагмент, и он работает (по крайней мере, для меня на хроме)
function copy_snippet(snippet){
if (document.selection){
document.selection.empty();
var range = document.body.createTextRange();
range.moveToElementText(document.getElementById(snippet));
range.select().createTextRange();
document.execCommand("copy");
}else if (window.getSelection){
if (window.getSelection().empty) { // Chrome
window.getSelection().empty();
} else if (window.getSelection().removeAllRanges) { // Firefox
window.getSelection().removeAllRanges();
}
var range = document.createRange();
range.selectNode(document.getElementById(snippet));
window.getSelection().addRange(range);
document.execCommand("copy");
}
}
<div id = "1">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam et tempus lacus, at congue augue. Vivamus nisl diam, ornare non justo vel, pulvinar gravida magna. Nullam posuere pharetra felis, sit amet viverra ex bibendum ut. Cras hendrerit tempor metus ut interdum. Suspendisse potenti. Etiam mi nunc, lacinia non justo vel, eleifend lobortis lectus. Morbi nulla diam, volutpat quis mauris ut, ultrices venenatis massa.
</div>
<button onclick = "copy_snippet('1');">Copy</button>
<br /><br />
<div id = "2">
Vestibulum est arcu, porttitor a leo in, rhoncus mattis elit. In hac habitasse platea dictumst. Praesent vitae felis vitae risus ornare mattis. Maecenas ac condimentum lorem. Proin ornare nisi non sapien accumsan, quis suscipit est pellentesque. Sed enim purus, auctor sit amet tincidunt id, convallis a eros. Aenean a rhoncus orci. Pellentesque consequat ligula tincidunt semper varius.
</div>
<button onclick = "copy_snippet('2');">Copy</button>