요새 블로그랑 게시판에서 쓸 HTML 웹에디터 한개 만들고 있다.
현재 내가 글을 쓰고 있는 이 에디터, 네이버 블로그의 에디터 역시 div를 contenteditable로 해서
글을 쓰게 만든 넘이고
이 객체에 아래 명령을 수행할 수 있게 하믄 위쪽의 버튼을 클릭했을때 웹에디터의 효과를 낼 수 있다.
document.getElementById(editor).contentWindow.document.execCommand("Bold", false, null);
이딴 식이다.
자세한 사용법은 microsoft msdn에 잘 나와 있다.
Parameters of execCommand Method
Let's take a look at parameters of execCommand. As I told you before, this method is the heart of our HTML Area. Just understand the parameters of this method, and the rest is really more than easy.
Command (First Parameter)
The First parameter of execCommand is UserCommand. It is a string value which defines the work to do. In our above example, we passed bold and italic respectively. There are a number of commands which could be passed to this function. A complete list of these commands can be found in MSDN. Just look for Command Identifiers or execCommand in Index of your MSDN library. I am writing some commands here which were used in my HTML area.
- BackColor To set the Back Color of the Text
- Bold To set the Text to Bold
- Copy To Copy some text to ClipBoard. (Copy will be made in HTML Format)
- CreateLink Select some text and execute this command. This will make your text a Hyper Link
- Cut Cuts text.
- FontName To Change the Font of the Selected Text
- FontSize To Change the Size of the Font.
- ForeColor To Change the Fore Color of the Text.
- Indent Increase the Indent of the Text/Paragraph.
- InsertImage To Insert Image in your Editor area.
- Italic To set the Text to Italic
- JustifyCenter Center Justifies the Text
- JustifyLeft Left Justifies the Text
- JustifyRight Right Justifies the Text
- Outdent Decrease the Indent.
- Redo Redo your last action (inverse of Undo)
- SaveAs Opens the Dialogue Box to save your work.
- StrikeThrough Set the Text to Strike Through.
- Subscript Moves the Selected text to slightly down than a normal text.
- Supercript Moves the Selected text to slightly up than a normal text.
- UnderLine To create Underlined text
- Undo Undo the last action.
- Unlink Removes hyperlink, if any
