使用jquery或javascript将文本复制到剪贴板

时间:2011-06-16 14:31:16

标签: javascript jquery zeroclipboard

如何使用jquery或javascript从google将一些文本复制到剪贴板。我知道那里

是一个名为 zeroclipboard http://code.google.com/p/zeroclipboard/的插件,可以用

执行此操作

交叉浏览者。说明链接http://code.google.com/p/zeroclipboard/wiki/Instructions

但是当我在我的网站上测试它时。我将其设置为可选地复制文本。它不能工作。

我的测试链接是http://xanlz.com/copy/1.html

它总是复制所有的价值观。即使我取消选中一些复选框。可能是价值不会改变。但是当我alter()变量时,值就可以了。怎么纠正呢?谢谢。

我希望它可以复制选中的复选框值。如果未选中该框,则不要复制其值。

2 个答案:

答案 0 :(得分:1)

编辑:

我花了一些时间来解决这个问题(没有对.swf的正确引用),但这是一个完整的工作示例(测试IE 8和Firefox 4)

<html>
  <head>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" ></script>
    <script type="text/javascript" src="http://zeroclipboard.googlecode.com/svn/trunk/ZeroClipboard.js" ></script>
    <script type="text/javascript" >
        $(document).ready(function(){
            var checkall = $('#checkall');
            var boxes = $('input[type="checkbox"]').not(checkall);
            checkall.click(function () {
                boxes.attr('checked', this.checked);
            });
            boxes.change(function() {
                checkall[0].checked = this.checked && boxes.filter(':checked').length === boxes.length;
            });

            ZeroClipboard.setMoviePath('http://zeroclipboard.googlecode.com/svn-history/r10/trunk/ZeroClipboard.swf');
            var clip = new ZeroClipboard.Client();

            clip.glue("copyvalue");
            clip.addEventListener( 'onMouseOver', function(){
                var text = ' '; //Make this a space since we can't copy nothing...
                $('input.forminput:checked').each(function() {
                    text += $(this).val() + "\n";
                });
                clip.setText(text);
            });
        }) ;
    </script>
  </head>
  <body>
    <input class="forminput" type="checkbox" value="test one" checked="checked" name="VD1">
    <br>
    <input class="forminput" type="checkbox" value="test two" checked="checked" name="VD2">
    <br>
    <input class="forminput" type="checkbox" value="test three" checked="checked" name="VD3">
    <br>
    <input class="forminput" type="checkbox" value="test four" checked="checked" name="VD4">
    <br>
    <input class="forminput" type="checkbox" value="test five" checked="checked" name="VD5">
    <br>
    <input id="checkall" type="checkbox" checked="checked" name="checkall">
    <input id="copyvalue" class="button" type="button" value="copy test">
  </body>
</html>   

<强> ORIGINAL:

您的按钮没有点击事件。

您需要添加以下内容:

    var clip = new ZeroClipboard.Client();
    $("#copyvalue").click(function(){
        var text = '';
        $('input.forminput:checked').each(function() {
            text += $(this).val() + "\n";
        });
        //alert(text);
        clip.setText(text);
    });

答案 1 :(得分:0)

如果您不喜欢使用(或不允许)依赖闪存(我个人不愿意),我认为您最好创建一个文本区域,其中包含预先选择的文本(或序列化数据)用户复制并稍后粘贴数据的指令。

您可以通过嗅探操作系统使指令感觉更原生,并提供有关如何复制和粘贴的不同说明(例如,对于Windows / linux使用ctrl + c或对于mac使用⌘-C)。

也许不那么性感,但更加万无一失......