javascript監(jiān)聽頁面復(fù)制事件添加版權(quán)信息

javascript監(jiān)聽頁面復(fù)制事件添加版權(quán)信息這個功能可以使得我們的文章以及代碼可以更好的得到宣傳。

1.介紹

當(dāng)頁面需要做版權(quán)保護時，比如當(dāng)用戶復(fù)制我們網(wǎng)站的文章時，我們會希望在他copy的文章內(nèi)容中添加一些版權(quán)信息，例如我們的網(wǎng)站地址。

2.實現(xiàn)方法

首先我們需要捕捉到用戶的復(fù)制事件,這里我們可以使用document.oncopy來綁定觸發(fā)事件,此時執(zhí)行復(fù)制操作時將會觸發(fā)addlink方法,addlink方法中將包含所有處理步驟

document.oncopy = addlink;

捕捉到復(fù)制事件后我們還需要在addlink事件執(zhí)行一些操作

function addlink() {

    var body_element = document.body;
    var selection;
    selection = window.getSelection();
    
    var locationHref=document.location.href;
    var appendlink="\r\n\r\n 原文出自[ 一只大臉貓博客 ] 轉(zhuǎn)載請保留原文鏈接: <a href='"+locationHref+"'>"+locationHref+"</a>";
    
    if (window.clipboardData) { // Internet Explorer    
        var copytext = selection + appendlink;
        
        window.clipboardData.setData ("Text", copytext);
        
        return false;
    
    } else {
    
        var copytext = selection + appendlink;
        var newdiv = document.createElement('div');
        newdiv.style.position='absolute';  
        newdiv.style.left='-99999px';
        body_element.appendChild(newdiv);
        newdiv.innerHTML = copytext;
        selection.selectAllChildren(newdiv);
        window.setTimeout(function() {

            body_element.removeChild(newdiv);
        
        },0);
    
    }

}

在上面的代碼中使用了兩種方法來兼容各種瀏覽器

1.直接通過瀏覽器接口操作剪切板，該方法在chrome firefox等版本較高的ie中可用

2.修改用戶選中的內(nèi)容 該方法基本上兼容所有瀏覽器

當(dāng)瀏覽器不能直接操作剪切板時便會使用第二種方法來確保追加生效

3.完整代碼

完整代碼就是上面代碼可以直接復(fù)制使用改掉一些需要改變的內(nèi)容。

文章作者：會修電腦、愛寫雞湯、愛敲代碼、剛寫文、互聯(lián)網(wǎng)新人、計算機愛好者的大臉貓（剛剛開始做文章筆名還沒想好暫用“大臉貓”）