4

I'm creating my own custom WYSIWYG editor, and I'd like all HTML to be removed from pasted content.

I do this by focusing a textarea on the paste event, then after a 10 millisecond timeout, I insert the contents of the textarea into the contentEditable.

Example: http://jsfiddle.net/JPM6p/

This is working great in Chrome, but doesn't work in Firefox or Internet Explorer. Does anyone know how to fix this?

Thanks

EDIT: Apparently it works in Firefox 6.0.2 on Mac OS X, so perhaps it works only in earlier verions of Firefox?

skimberk1
  • 1,984
  • 3
  • 19
  • 26
  • Works on Mac OS 10.7 Lion in FF 6.0.2, Safari 5.1.1, and Chrome 17.0.963.46. – HellaMad Feb 11 '12 at 21:49
  • @DC_ That's weird, maybe it only works in earlier versions of FF? – skimberk1 Feb 11 '12 at 21:53
  • 1
    Just a heads-up: I've used contentEditable a fair amount (we use it in a few places on [Bitbucket](https://bitbucket.org/)) and I've found it to be a source of many bugs. Browsers don't agree on how certain things should be handled, such as line breaks in pasted content. In other words, good luck! :s – davidchambers Feb 11 '12 at 22:04
  • @davidchambers Do you know of any other methods to create a rich-text editor in the browser? – skimberk1 Feb 11 '12 at 22:05
  • I prefer using a markdown editor or pagedown, such as the one SO here uses. It has a little bit of a learning curve, but it is much more consistent. – Kevin B Feb 11 '12 at 22:26
  • use rangy.googlecode.com for contentEditable. Works like a charm – Morgan T. Feb 14 '12 at 20:12

1 Answers1

2

You need to focus the textarea before the paste event fires in some browsers, which means you can only realistically use this technique for pastes triggered by keyboard shortcuts such as Ctrl-V. Here's a similar question with more information:

https://stackoverflow.com/a/2177059/96100

Community
  • 1
  • 1
Tim Down
  • 292,637
  • 67
  • 429
  • 506
  • Ctrl + v is not working sometimes in firefox v-29 browser. If I resize the browser window then I am able to paste. (paste event is triggering). Is there any problem with firefox 29 browser with contenteditable or paste event with keyboard short cuts (ctrl + v) ? – Jak May 15 '14 at 21:29
  • @Jak I'm seeing a problem in FF29 on Windows with pasting marked-up text into a contenteditable. Straight text works fine. – Hans May 18 '14 at 16:04