我想向我的ASP.NET网页添加复制到剪贴板功能。我找到了 ZeroClipboard,但我找不到任何一个有效的例子。我可以让它在本地计算机上工作还是需要上传到服务器来测试它?
请给我一个示例链接。
我想向我的ASP.NET网页添加复制到剪贴板功能。我找到了 ZeroClipboard,但我找不到任何一个有效的例子。我可以让它在本地计算机上工作还是需要上传到服务器来测试它?
请给我一个示例链接。
jQuery ZeroClipBoard可能是您正在寻找的。ZeroClipBoard 使用不可见的 Adobe Flash 影片来实现剪贴板功能。我们在我们的项目中使用它,它工作得非常好。
它很容易实现。下载 Flash 文件并将其包含在脚本文件夹中,然后按照以下步骤操作。
将 jQuery 和 zClip 添加到您的文档中:
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.zclip.js"></script>
在 <script> 块内,将 zClip 附加到将成为“复制按钮”的元素:
$(document).ready(function(){
$('a#copy-description').zclip({
path:'js/ZeroClipboard.swf',
copy:$('p#description').text()
});
// The link with ID "copy-description" will copy
// the text of the paragraph with ID "description"
$('a#copy-dynamic').zclip({
path:'js/ZeroClipboard.swf',
copy:function(){return $('input#dynamic').val();}
});
// The link with ID "copy-dynamic" will copy the current value
// of a dynamically changing input with the ID "dynamic"
});
该文档有一个关于如何设置它的完整示例。如果我们假设您使用Razor:
<html>
<body>
<button id="copy-button" data-clipboard-text="Copy Me!" title="Click to copy me.">Copy to Clipboard</button>
<script src="@Url.Content("~/scripts/ZeroClipboard.js")"></script>
<script type="text/javascript">
var pathToSWF = '@Url.Content("~/scripts/ZeroClipboard.swf")';
</script>
<script src="@Url.Content("~/scripts/main.js)""></script>
</body>
</html>
然后在你的里面main.js
:
// main.js
var clip = new ZeroClipboard( document.getElementById("copy-button"), {
moviePath: pathToSWF
} );
clip.on( 'load', function(client) {
// alert( "movie is loaded" );
} );
clip.on( 'complete', function(client, args) {
this.style.display = 'none'; // "this" is the element that was clicked
alert("Copied text to clipboard: " + args.text );
} );
clip.on( 'mouseover', function(client) {
// alert("mouse over");
} );
clip.on( 'mouseout', function(client) {
// alert("mouse out");
} );
clip.on( 'mousedown', function(client) {
// alert("mouse down");
} );
clip.on( 'mouseup', function(client) {
// alert("mouse up");
} );