js 复制网页内容，兼容各浏览器

最新推荐文章于 2024-09-05 11:51:57 发布

转载最新推荐文章于 2024-09-05 11:51:57 发布 · 444 阅读

本文介绍了一种使用JavaScript实现的单击复制当前网页URL至剪贴板的功能，并提供了一个兼容多浏览器的解决方案，利用zClip插件实现了跨平台的复制功能。

js 复制网页内容，兼容各浏览器

分类： jQuery 2013-12-17 02:56 2036人阅读评论(1) 收藏举报

因需要做一个js单击,复制当前网页url的功能。使用的是如下的方法，但是只能在ie浏览器下正常使用。

方法如下：

[javascript] view plain copy print ?

function copyURL(){
var clipBoardContent="";
clipBoardContent+=document.title;
clipBoardContent+="";
clipBoardContent+=this.location.href;
window.clipboardData.setData("Text",clipBoardContent);
alert("复制成功，请粘贴到你的QQ/MSN上推荐给你的好友");
}

function copyURL(){
 var clipBoardContent="";
 clipBoardContent+=document.title;
 clipBoardContent+="";
 clipBoardContent+=this.location.href;
 window.clipboardData.setData("Text",clipBoardContent);
 alert("复制成功，请粘贴到你的QQ/MSN上推荐给你的好友");
 }

-----------------------------------分隔线-----------------------------------------------------------

在网上找到一个flash

zClip

zClip 插件可以兼容各种浏览器。

使用方法很简单，只需要导入一个js文件和一个swf文件即可。

使用方法如下

需先导入所需文件：

<script type="text/javascript"src="js/jquery.js"></script>
<script type="text/javascript"src="js/jquery.zclip.js"></script> - See more at: http://www.steamdev.com/zclip/#sthash.wtIQfaKp.dpuf

<script type="text/javascript"src="js/jquery.js"></script>
<script type="text/javascript"src="js/jquery.zclip.js"></script> - See more at: http://www.steamdev.com/zclip/#sthash.wtIQfaKp.dpuf

[javascript] view plain copy print ?

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.zclip.js"></script>
$(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"
});

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.zclip.js"></script>

$(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"

});

还有一些配置方法，详见官网：http://www.steamdev.com/zclip/

插件下载地址：http://download.youkuaiyun.com/detail/honglei_zh/6717935

易轮胎