在这节,我们将看到如何把多行文本框的内容复制到剪贴板上。
注意:jQuery clipboard plugin 只支持IE
界面代码:
1
<
form
id
="form1"
runat
="server"
>
2
<
div
align
="center"
>
3
<
fieldset
style
="width: 400px; height: 300px;"
>
4
<
p
>
请输入你的评论:
</
p
>
5
<
asp:TextBox
ID
="txtComment"
TextMode
="MultiLine"
Rows
="5"
Width
="300px"
Height
="200px"
6
runat
="server"
></
asp:TextBox
>
7
<
br
/>
8
<
asp:HyperLink
ID
="lnkHighlight"
Text
="点击复制评论"
runat
="server"
></
asp:HyperLink
>
9
</
fieldset
>
10
</
div
>
11
</
form
>
显示界面:
脚本部分:
1
<
script
src
="Scripts/jquery-1.4.1-vsdoc.js"
type
="text/javascript"
></
script
>
2
<
script
src
="Scripts/jquery.clipboard.js"
type
="text/javascript"
></
script
>
3
<
style
type
="text/css"
>
4
a
5
{
6
color
:
#0000FF
;
7
cursor
:
pointer
;
8
}
9
</
style
>
10
<
script
type
="text/javascript"
>
11
$(document).ready(
function
() {
12
$.clipboardReady(
function
() {
13
$(
"
a
"
).click(
function
() {
14
$(
"
#<%=txtComment.ClientID %>
"
).select();
15
$.clipboard($(
"
#<%=txtComment.ClientID %>
"
).val());
16
});
17
});
18
});
19 </script>
加入脚本后点击复制按钮显示效果如下:
打开记事本按Ctrl+V:
哈哈成功了,就这么简单。
插件下载地址:
http://plugins.jquery.com/project/clipboard
另外有一个Zero clipboard 插件支持跨浏览器,它是通过一个flash文件和JavaScirpt接口实现的,想了解更多信息,请访问http://code.google.com/p/zeroclipboard/

