单击按钮将内容复制到剪贴板 - cnBruce's Blog | 布鲁斯狼

来源：百度文库编辑：神马文学网时间：2024/04/27 18:45:40

字符串拆分成单个字符相加和不超... :篇一上下一篇: DWCS3-CSS布局之二CS... :

本日志标题：单击按钮将内容复制到剪贴板 [2008-8-20]

我们通常会通过单击按钮的操作，将定义好的内容直接复制到剪贴板

对于用户来说点了按钮直接【Ctrl】+【V】就可以了。

其实该功能的核心原理就是用到了window子对象clipboardData的一个方法：setData()

其语法是：clipboardData.setData(sDataFormat, sData)

参数sDataFormat表示要复制的内容的格式；参数sData则要复制的内容。
返回值：复制成功返回true；失败返回false。

比如：
clipboardData.setData("text","www.cnbruce.com")

[Ctrl+A 全部选择进行拷贝提示：可先修改部分代码，再点击运行]

以上是定义了固定的值复制到本地剪贴板，可用在诸如“将本页转阅给朋友”类似的功能需求中，以达到快捷转达网址或信息的目的。

此外，我们还会遇到这样的一些情况：当我们在某网站复制了一段内容之后，在粘贴下来时，发现不自觉的多了一行信息，该信息即是由内容复制到剪贴板同时增加的一行信息。

也就是说我们写入到剪贴板中的值除了拷贝的选择内容外，还有自己定义的值，那么如何获得“拷贝的选择内容”，这就需要使用到 document.selection.createRange() 方法，其中该方法配合 execCommand，在 HTML 编辑器中很有用，比如：文字加粗、斜体、复制、粘贴、创建超链接等。

[Ctrl+A 全部选择进行拷贝提示：可先修改部分代码，再点击运行]

所以，应用了document.selection.createRange().text就能重新定义剪贴板中的值了。

[Ctrl+A 全部选择进行拷贝提示：可先修改部分代码，再点击运行]

需要注意的是，该脚本执行要位于页面最低部。

单击按钮将内容复制到剪贴板 - cnBruce's Blog | 布鲁斯狼将网页内容复制到剪切板上（按钮事件）] 将网页内容复制到剪切板上（按钮事件）] 使用Spry轻松将XML数据显示到HTML页 - cnBruce's Blog | 布鲁斯... 可以将脚本的输出复制到剪贴板吗？ CMS(网站内容管理系统)有哪些？ - cnBruce's Blog | 布鲁斯狼常用CSS命名参考 - cnBruce's Blog | 布鲁斯狼常用CSS缩写语法收集 - cnBruce's Blog | 布鲁斯狼 CSS样式表常用小技巧 - cnBruce's Blog | 布鲁斯狼为什么要进行“标准” - CNBRUCE‘S BLOG(布鲁斯狼) Dreamweaver扩展（插件）的开发 - CNBRUCE‘S BLOG(布鲁斯狼) /// 专注WEB技术,关注生活点滴限制复选框的最大可选数(转摘) - cnBruce's Blog | 布鲁斯狼 DWCS3-CSS布局之一CSS规则大纲 - cnBruce's Blog | 布鲁斯狼 DWCS3-CSS布局之二CSS规则定义 - cnBruce's Blog | 布鲁斯狼网页中各度量单位的比较 - cnBruce's Blog | 布鲁斯狼通用的IE,firefox复制文本到剪贴板福昕pdf阅读器，使用快照工具之后弹出您选择的内容已复制到剪贴板，但是到底在哪里呢？巧用Word把复制来的网页乱码转换清零 cxstill剪贴板天极Blog CSS框架的相关汇总（CSS Frameworks） - cnBruce's Blog |... 妙用复制、粘贴命令—Windows剪贴板将风景图片复制到U盘中如何复制一个网页内容到另一个网页? 剪贴板将Flash内容插入到视频