Web应用程序如何检测粘贴事件并检索要粘贴的数据？
我想在将文本粘贴到富文本编辑器之前删除HTML内容.
之后粘贴后清理文本有效,但问题是所有以前的格式都丢失了.例如,我可以在编辑器中编写一个句子并将其设为粗体,但是当我粘贴新文本时,所有格式都会丢失.我想只清理粘贴的文本,并保持以前的格式不变.
理想情况下,该解决方案应适用于所有现代浏览器(例如,MSIE,Gecko,Chrome和Safari).
请注意,MSIE有clipboardData.getData(),但我找不到其他浏览器的类似功能.
我正在尝试权衡使用<div>和<iframe>制作我自己的富文本/所见即所得编辑器的优点和缺点.
在这样做的时候,为什么我不能只使用一个满足 <div>而且为什么这么多人更喜欢<iframe>？
背景讨论:根据我的理解,制作一个所见即所得编辑器的常用方法是使div或iframe 满足,然后对execCommand包含div或iframe主体的文档进行操作,使其文本变为粗体或其他.
这是HTML:
<html><!--parent doc-->
<body><button type="button" class="btn-bold">Bold</button>
<div contenteditable="true"></div>
</body>
</html>
VS:
<html><!--parent doc-->
<body><button type="button" class="btn-bold">Bold</button>
<iframe>
<body contenteditable="true"></body>
</iframe>
</body>
</html>
和JS:
$(document.body).on('click', '.btn-bold', function(){
document.execCommand('bold', false, null);
});
VS:
$(document.body).on('click', '.btn-bold', function(){
window.frames[0].document.body.execCommand('bold', false, null);
});
看起来大多数制作精良的富文本编辑器都使用iframe.虽然我可以很容易地在Webkit浏览器中使用这个contenteditable/execCommandcombo来处理div/iframe,但是我有一个地狱般的时间试图让iframe在Firefox中运行.我不得不求助于将脚本和样式表加载到iframe和各种废话中来复制我可以使用基于div的版本轻松完成的任务.所以<div>基于方法似乎更可取.我重新考虑任何有力的理由？