javascript javascript将富文本内容复制到剪贴板
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/23934656/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
javascript copy rich text contents to clipboard
提问by marv
Premise
前提
I need help copying rich text to the clipboard using JavaScript. I have searched around and haven't found anything to suit my specific needs.
我需要帮助使用 JavaScript 将富文本复制到剪贴板。我四处搜索,没有找到任何适合我特定需求的东西。
Code
代码
function ctrlA1(corp) {
with(corp) {}
if (document.all) {
txt = corp.createTextRange()
txt.execCommand("Copy")
} else
setTimeout("window.status=''", 5000)
}
<div id="sc1">hello <br> <b> world </b> </div>
<button onclick="ctrlA1(document.getElementById('sc1') )"></button>
Problem
问题
The aforementioned code isn't working and is resulting in an object expected error
. Any help is appreciated!
I have seen a library out there called zeroclipboard
, but would prefer to write my own function.
上述代码不起作用,并导致object expected error
. 任何帮助表示赞赏!我见过一个名为 的库zeroclipboard
,但更愿意编写自己的函数。
Edit:
编辑:
I now have this function to select text on the page. is it possible to write a formula to copy the selected range as is?
我现在有这个功能来选择页面上的文本。是否可以编写一个公式来按原样复制所选范围?
function containerSelect(id) {
containerUnselect();
if (document.selection) {
var range = document.body.createTextRange();
range.moveToElementText(id);
range.select();
} else if (window.getSelection) {
var range = document.createRange();
range.selectNode(id);
window.getSelection().addRange(range);
}
}
<label onclick="containerSelect(this); select_all()">
<p>hello world</p>
<img src="imagepath.png">
</label>
采纳答案by marv
i searched for a week now and finally found my answer!!! for those of you looking to copy rich text to the clipboard with javascript, then use the function at the link below, works like a charm. no need of flash and other stuff suggested :)
我现在搜索了一个星期,终于找到了我的答案!!!对于那些希望使用 javascript 将富文本复制到剪贴板的人,然后使用下面链接中的功能,就像一个魅力。不需要闪光灯和其他建议的东西:)
回答by John Henckel
With modern browsers, if you want copy rich textonly, there is a very easy solution without using any packages. See http://jsfiddle.net/jdhenckel/km7prgv4/3
对于现代浏览器,如果您只想复制富文本,有一个非常简单的解决方案,无需使用任何包。见http://jsfiddle.net/jdhenckel/km7prgv4/3
Here is the source code from the fiddle
这是小提琴的源代码
<button onclick="copyToClip(document.getElementById('foo').innerHTML)">
Copy the stuff
</button>
<div id=foo style="display:none">
This is some data that is not visible.
You can write some JS to generate this data.
It can contain rich stuff. <b> test </b> me <i> also </i>
<span style="font: 12px consolas; color: green;">Hello world</span>
You can use setData to put TWO COPIES into the same clipboard,
one that is plain and one that is rich.
That way your users can paste into either a
<ul>
<li>plain text editor</li>
<li>or into a rich text editor</li>
</ul>
</div>
the function
功能
function copyToClip(str) {
function listener(e) {
e.clipboardData.setData("text/html", str);
e.clipboardData.setData("text/plain", str);
e.preventDefault();
}
document.addEventListener("copy", listener);
document.execCommand("copy");
document.removeEventListener("copy", listener);
};
回答by SFlagg
This tiny JS plugin copies richtext without using Flash: https://www.npmjs.com/package/clipboard-js
这个小小的 JS 插件无需使用 Flash 即可复制富文本:https: //www.npmjs.com/package/clipboard-js
It's based on https://clipboardjs.com/- but it's an upgrade in my opinion, because the original only supports plain text.
它基于https://clipboardjs.com/- 但在我看来它是一个升级,因为原来只支持纯文本。
The code is simple:
代码很简单:
clipboard.copy({
"text/html": "<i>Markup</i> <b>text</b>. Paste me into a rich text editor."
});
回答by James Harrington
Well here is the deal most modern web browsers wont let you have access to the clip board. However like with everything there is a work around.
好吧,这是大多数现代网络浏览器不会让您访问剪贴板的交易。然而,就像所有事情一样,有一个解决方法。
https://github.com/zeroclipboard/zeroclipboard
https://github.com/zeroclipboard/zeroclipboard
this is a js/flash plugin that lets you copy text to your clipboard.
(i believe you can use it for rich text.)
这是一个 js/flash 插件,可让您将文本复制到剪贴板。
(我相信您可以将它用于富文本。)