0

我想向我的ASP.NET网页添加复制到剪贴板功能。我找到了 ZeroClipboard,但我找不到任何一个有效的例子。我可以让它在本地计算机上工作还是需要上传到服务器来测试它?

请给我一个示例链接。

4

2 回答 2

1

jQuery ZeroClipBoard可能是您正在寻找的。ZeroClipBoard 使用不可见的 Adob​​e Flash 影片来实现剪贴板功能。我们在我们的项目中使用它,它工作得非常好。

它很容易实现。下载 Flash 文件并将其包含在脚本文件夹中,然后按照以下步骤操作。

  1. 将 jQuery 和 zClip 添加到您的文档中:

    <script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript" src="js/jquery.zclip.js"></script>
    
  2. 在 <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"
    });
    
于 2013-02-25T14:32:06.240 回答
0

该文档有一个关于如何设置它的完整示例。如果我们假设您使用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");
} );
于 2013-02-25T14:30:16.807 回答