JQuery te--compatible IE6 Lightweight text editor plug-in

I. Introduction of JQuery TE

• Official page
• Project Demo
• Official documents

jquery Te is a lightweight jquery web editor plugin that compresses only 19.5KB and has a very good compatibility with the WYSIWYG text editor. Tested for compatibility with IE6.

And, you can customize its style, write some CSS, not just textarea, you can change a variety of tags into an editor, such as span, or p and so on.

Compatibility: ie6+, Chrome, Firefox, Opera, Safari, Yandex browser, etc.

Second, how to use1. Introduction of documents

Easy to use here, the introduction of the CDN address, you can also go to the official website to download, there are demo.

<link href= "Http://cdn.bootcss.com/jquery-te/1.4.0/jquery-te.min.css" rel= "stylesheet" ><script src= "http ://cdn.bootcss.com/jquery/2.1.1/jquery.min.js "></script><script src=" http://cdn.bootcss.com/ Jquery-te/1.4.0/jquery-te.min.js "></script>

2. Definition Editor

You can use the Fit tag to define the editor, of course, as long as you have a class value corresponding to the script tag below. But usually, we create an editor that generally uses textarea tags.

<textarea name= "textarea" class= "Jqte-test" ></textarea>

Or, yes (using one):

<input class= "Jqte-test" name= "Text2" value= "articles should is in here" ><div class= "Jqte-test" name= "Text3" >articles should is in Here</div><span class= "Jqte-test" name= "Text4" >articles should is in Here</span ><p class= "Jqte-test" name= "Text5" >articles should is in here</p>

3. Create Editor

<script>        $ ('. Jqte-test '). Jqte ();    </script>

By now, an editor has been configured, of course, before we said, you can customize its many styles, then, below, we will try.

Third, custom1. Disabling or enabling a feature

For example, I do not want to use the Bold button, disappear in the selection, this time can be written in JS, as follows:

<script>        $ ('. Jqte-test '). Jqte ({            "B": false        });    </script>

For more information about how many feature buttons can be disabled, refer to their official documentation. Here is a picture, some features I did not try:

2. Events

The JQuery TE provides three basic events:

Change: Trigger focus when text box content changes: Focus on text box trigger blur: Trigger when text box loses focus

How to use:

<script>        $ ('. Jqte-test '). Jqte ({            blur:function () {                         alert ("Lost Focus");                     }        );    </script>

Other calling methods are similar, simply changing blue to change or focus, and then writing jquery statements in function.

3. Other

In addition to some of the above features, the editor supports keyboard shortcut operations, as follows: All shortcut keys four ctrl+xx form, for example, font bold is "Ctrl+b"

JQuery te--compatible IE6 Lightweight text editor plug-in