jQuery副本到剪貼板4個選項

>本文探討了四個用於自動化剪貼板複製的jQuery和JavaScript方法：ZCLIP，零剪貼板，複製文本解決方法以及David Walsh教程中的方法。 每種方法都提供獨特的優點和劣勢，使一些更適合特定情況。

作者與其他插件選項相比，由於其相對簡單性，作者建議複製文本解決方法。

>

>至關重要的是，使用純JavaScript可以在沒有jQuery的情況下實現剪貼板複製。但是，瀏覽器兼容性可能是一個問題，因為

缺乏普遍的支持。 諸如剪貼板庫或剪貼板API之類的替代方案提供了更好的跨瀏覽器兼容性。 document.execCommand('copy')

>我今天的實驗涉及使用jQuery（和Plain JavaScript）來自動剪貼板複製，這是一項通過右鍵單擊＆gt＆gt;複製或ctrlC。通常，

方法可以處理此操作，但它似乎僅在Internet Explorer中起作用。 解決方法涉及使用Flash SWF文件。存在幾個jQuery插件，我已經確定了四個選項：execCommand('copy')>

1. ZClip：此插件僅通過超鏈接功能。 它的核心功能（僅用於IE）如下所示：

function copy(str) {
    //for IE ONLY!
    window.clipboardData.setData('Text', str);
}

零剪貼板：
2. 一個可靠的剪貼板插件（省略為簡短的下載鏈接）。其用法的片段：

function init() {
    clip = new ZeroClipboard.Client();
    clip.setHandCursor(true);
    clip.addEventListener('load', my_load);
    clip.addEventListener('mouseOver', my_mouse_over);
    clip.addEventListener('complete', my_complete);
    clip.glue('d_clip_button');
}

複製文本解決方法：
3. 此方法提供了一種更簡單的方法。

jQuery代碼：

$(document).ready(function(){
    $('li').live('click', function(){
        var path = $('#pathtonode').html();
        path = path.replace(/ > /g,".");
        addtoppath(path);
    });
    $('#toppathwrap').hide();

    function addtoppath(path) {
        $('#copypath').val(path);
        $('#toppathwrap').show();
        $('#copypath').focus();
        $('#copypath').select();
    }   
});

$('#copypath', 'body')
    .find('a')
        .livequery('click', function() {
            $(this).blur();
            var nodetext = $('#id-of-element-to-copy').html();
            $('#copypath input').focus();
            $('#copypath input').select();
            return false;
        });

html代碼：

> css代碼：

<div id="toppathwrap">
    <input type="text" id="copypath">
</div>

>

> David Walsh教程方法：

#toppathwrap { position:fixed; top:0px; right:0px; background-color:#F2F1E8; padding:5px; display:none; }

此方法利用JavaScript函數，並可能是更廣泛兼容性的閃存組件。

>
（注意：簡短省略源鏈接，但在原始輸入中存在。

以上是jQuery副本到剪貼板4個選項的詳細內容。更多資訊請關注PHP中文網其他相關文章！