30行代码,给hexo博客添加点击复制代码的功能

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
function copyToClipboard(str) {
var save = function (e) {
e.clipboardData.setData('text/plain', str);
e.preventDefault();
}
document.addEventListener('copy', save);
document.execCommand('copy');
document.removeEventListener('copy', save);
}

$('figure.highlight').map(function (k, el) {
var btn = $('<div class="click-copy-code">单击复制代码</div>');
$(el).css({
'position': 'relative'
})
btn.css({
'padding': '5px 10px',
'position': 'absolute',
'top': '0',
'right': '0',
'background': '#6acaf1',
'color': '#fff',
'font-size': '12px',
'cursor': 'pointer',
})
btn.click(function () {
var content = $(el).find('.code')[0].innerText;
copyToClipboard(content)
})
$(el).append(btn[0])
})
Partager