这篇文章主要介绍了JavaScript 内容复制(无需flash) Clipboard.js使用方法,需要的朋友可以参考下
clipboard.js 实现了纯 JavaScript (无 Flash)的浏览器内容复制到系统剪贴板的功能。可以在浏览器和 Node 环境中使用。支持 Chrome 42+、Firefox 41+、IE 9+、Opera 29+
官方网站:https://github.com/zenorocha/clipboard.js
软件下载:http://www.jb51.net/jiaoben/385604.html
官方使用方法:https://zenorocha.github.io/clipboard.js/#example-text
示例代码:
官方实例一:
在线演示:http://demo.jb51.net/js/2015/clipboard/
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
|
<script src=
"clipboard.min.js"
></script>
<textarea id=
"bar"
cols=
"62"
rows=
"5"
autocomplete=
"off"
autocorrect=
"off"
autocapitalize=
"off"
spellcheck=
"false"
>脚本之家是国内专业的网站建设资源、脚本编程学习类网站,提供asp、php、asp.net、javascript、jquery、vbscript、dos批处理、网页制作、网络编程、网站建设等编程资料。</textarea>
<!-- Trigger -->
<button class=
"btn"
data-clipboard-action=
"copy"
data-clipboard-target=
"#bar"
>
Cut to clipboard
</button>
<script>
var
clipboard =
new
Clipboard(
'.btn'
);
clipboard.on(
'success'
,
function
(e) {
console.info(
'Action:'
, e.action);
console.info(
'Text:'
, e.text);
console.info(
'Trigger:'
, e.trigger);
alert(
"复制成功"
);
e.clearSelection();
});
clipboard.on(
'error'
,
function
(e) {
console.error(
'Action:'
, e.action);
console.error(
'Trigger:'
, e.trigger);
});
</script>
|
官方实例二:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
|
<script src=
"dist/clipboard.min.js"
></script>
<button class=
"btn"
>
<script type=
"text/javascript"
>
var
clipboard =
new
Clipboard(
'.btn'
);
clipboard.on(
'success'
,
function
(e) {
console.info(
'Action:'
, e.action);
console.info(
'Text:'
, e.text);
console.info(
'Trigger:'
, e.trigger);
e.clearSelection();
});
clipboard.on(
'error'
,
function
(e) {
console.error(
'Action:'
, e.action);
console.error(
'Trigger:'
, e.trigger);
});
</script>
|