如何清理粘贴上的输入？一个小小的 WYSIWYG 编辑器

Question

嘿 Stackoverflow 社区，

我编写了一个示例代码，它应该在粘贴时清理 HTML 代码，但它没有按预期工作。在每次粘贴时，它都会复制 <textarea> 并且粘贴不起作用。

这里是 JsFiddle：http://jsfiddle.net/Kxmaf/214/

非常感谢任何帮助:)

Answer 1

新版本： http://jsfiddle.net/Kxmaf/218/

您对setTimeout() 的看法是正确的，不知道 paste 事件延迟。 现在，我在 FF 上看到，document.execCommand() 有点错误，所以我简化了很多（不再关注，execCommand）：

$editor.on('paste, keydown', function() {
    var $self = $(this);            
    setTimeout(function(){ 
        var $content = $self.html();             
        $clipboard.val($content);
    },100);
});

---

这个怎么样：http://jsfiddle.net/Kxmaf/215/

$editor.on('paste, keydown', function() {
     var $self = $(this),
         $content = $self.html();       
     $clipboard.val('').focus();
     document.execCommand('insertHTML', false, $content);
     $self.html($content);
     placeCaretAtEnd($self);                
});

没有更多setTimeout()。 我也添加了 keydown ，因为它对我来说听起来更好；）如果你愿意，你可以删除它。 这样做：

• 获取#content的内容
• 删除 textarea 内容并专注于它。
• 将内容从#content 插入到textarea
• 替换#content的内容以防它被删除或替换（这是我测试的一部分，我不知道$self.html($content);现在是否相关。
• 在#content 末尾添加插入符号。

placeCaretAtEnd() 来自https://stackoverflow.com/a/4238971/460368，我稍作修改。