How to create a simple jQuery text editor

Question

I am creating a new project that needs a simple html editor. How to create a simple text editor using jquery?

Answer 1

I suggest: jqueryte

It is wonderful and simple;)

Answer 2

I forked the jQueryTE plugin (an excellent text editor with a minimum size) and made it compatible with jQuery Mobile - now it resizes using a browser and the panel will span 2 lines if necessary (portrait view on iPhone, for example).

https://github.com/jeffijoe/jQuery-TE

Screening for what it looks like:

Portrait

Landscape

Answer 3

, :

http://www.intrepidstudios.com/projects/jquery-rich-text-editor/demo.aspx http://freshcode.co/plugins/jquery.contenteditable/demo.html

Answer 4

. . , .

.

HTML:

<div id="editor" contenteditable="true">Lorem Ipsum is simply dummy text</div>
<button id="make-bold">Make bold</button>

JS:

document.getElementById('make-bold').addEventListener('click', function(event){
    event.preventDefault();

    var selection = window.getSelection();
    var range = selection.getRangeAt(0).cloneRange();
    var tag = document.createElement('strong');

    range.surroundContents(tag);
    selection.addRange(range);
});

Live demo - https://jsfiddle.net/im4aLL/Lyusxq3p/

, , , .

EasyEditor - https://github.com/im4aLL/easyeditor . . , node, , node node. , .

, , , .

EasyEditor

• : http://habibhadi.com/lab/easyeditor/
• : http://habibhadi.com/lab/easyeditor/examples.html
• : http://habibhadi.com/lab/easyeditor/documentation.html

http://habibhadi.com/lab/easyeditor/default-example.html

Answer 5

10 jQuery

Answer 6

You can choose one of the following options: http://www.queness.com/post/212/10-jquery-and-non-jquery-javascript-rich-text-editors

I personally prefer the TinyMCE editor, not jquery.

Answer 7

CKEditor is my option for a decent editor.