Basic javascript wysiwyg editor

我的未来我决定 提交于 2019-12-06 14:54:47

问题


Can I get an explanation on how to make a wysiwyg editor using a textarea? All I need it to be able to do is parse basic html tags like bold, italics, underline, etc. It doesn't need to have any buttons that inserts it, I just want to have a default text inside the textarea tags that parse the html.

Example:

<textarea cols="20" rows="20" name="ok">
<b>wat</b>
</textarea>

This will print out <b>wat</b> instead of wat inside the textarea.

Edit: jQuery is preferred


回答1:


Look into the contenteditable attribute. It's supported in many modern browsers. Just add it to an element and edit away...

document.getElementById('something').contentEditable = true;

Of course it doesn't work on textareas. You'd need to swap the textarea out with a div and make that editable. You'd also need to make sure the textarea has the contents (e.g. innerHTML) of the div as its value when the form is submitted.




回答2:


A textarea cannot parse HTML -- period. (Anyone can feel free to correct me on this)

The WYSIWYG editors that you see are not in a textarea, at least not in the same way. I suggest using a prebuilt editor such as TinyMCE or FCK Editor.




回答3:


A textarea will not parse HTML, but by using a WYSIWYG plugin, an editor will replace the textarea and give the user the ability to view and modify the content. With some editors, such as TinyMCE, you are able to set it to Simple mode, and allow only the basics of formatting (bold, italic, underline, bullets, etc) like you are interested in. This helps keeps the editor from being cluttered with unnecessary tools.

I suggest checking out TinyMCE or CKEditor



来源:https://stackoverflow.com/questions/3644652/basic-javascript-wysiwyg-editor

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!