How to create a rich text editor [closed]_问答_开发者

How to create a rich text editor [closed]

开发者 https://www.devze.com 2023-03-06 12:31 出处：网络

It's difficult to tell what is being asked here. This question is ambiguous, vague, incomplete, overly broad, or rhetorical andcannot be reasonably answered in its current form. For help clari

It's difficult to tell what is being asked here. This question is ambiguous, vague, incomplete, overly broad, or rhetorical and cannot be reasonably answered in its current form. For help clarifying this question so that it can be reopened, visit the help center. Closed 11 years ago.

Hey all i want to know what is the concept behind creating the rich text editor. i mean how to create a rich text editor. I want to learn the implementation.

PS: please donot suggest using YUI or any other built in library. I want to make one my own.

So开发者_如何学Go what's the concept behind?

Thanks :)

The easiest way is the following. It's used by TinyMCE and CKEditor and many others. There are many variations: in particular, if you are creating a code editor, there are clever tricks you can do using textareas and a monospaced font.

Dynamically create an iframe and place the editable content within that iframe's document
Set the iframe to be editable either by setting its document's designMode property to "on" or by setting its <body> element's contentEditable property to true. Note that designMode support predates contenteditable in Firefox and as a consequence is a lot less buggy.
Add buttons (such as bold, italic, insert image, etc) somewhere sensible (such as directly above the editable iframe) in the main document that act on the selected content within the iframe. All browsers supply an execCommand() method (see MSDN and MDN, for example) for doing many of these actions, although there is some variation in exactly how they work and what mark-up they produce.

That's the very basics of how it works. There are tons of other, complicated things that most editors do that aren't immediately obvious, in part to iron out the many differences between browsers and in part to provide extra functionality not covered by the built-in browser commands. It's a very complicated and difficult thing to get right, requires a high degree of expertise and commitment and is not something to be taken on lightly.

I won't suggest you look at others to use but I would suggest taking a look at jWYSIWYG to see how it's coded in jQuery.