TinyMCE, CKEditor, and Froala allow you to copy-paste HTML tables (e.g. from an email or Wikipedia) directly into the HTML textarea and the HTML table structure and tags are preserved.

For an additional example, my web-based email client can also do this. I can copy an HTML table from an email I received into an email I am sending, and the table structure will be preserved.

I understand that these editors are not just HTML textareas, rather they are rich text editors. My question: What browser capabilities allow for rich text editing? How do they do this?

From what I can tell, every time I copy-paste some HTML into a textarea, the browser strips out all HTML tags.

CodePudding user response：

The answer is that HTML is very flexible and you aren't limited to the default behavior of input elements for user interaction. Specifically how it handles non plaintext paste, the answer is it isn't simple.

Luckily there are a few open source rich text editors. For example, in ckeditor it is handled by the clipboard pipeline which takes the paste event and applies the correct styling in the editor.

CodePudding user response：

Often these editors will have a user-visible <div> element as the element that renders the table and a hidden <textarea> element that contains the actual markup that will be sent to the server when the form is submitted.