JavaScript editors and code formatting _javascript tips on Web pages

Why not textarea it?

1 not highlighted

The 2 Tab key is not available. --Press the TAB key to switch to the next control

3 No code formatting. -because you are accustomed to the eclipse environment, you can use CTRL+SHIFT+F to format the code.

Of course, I am not strong enough to achieve the extent of their own, and with the toes can be thought to be sure that someone has achieved, it can not find a look.

After a difficult search, finally found on the sourceforge of a project called Editarea, feeling very good. http://sourceforge.net/projects/editarea/

And its sample is very clear.

Construct on a Web page with the following methods

Copy Code code as follows:

<script language= "Javascript" type= "Text/javascript" src= ". /edit_area/edit_area_full.js "></script>
<script language= "Javascript" type= "Text/javascript" >
Initialisation
Editarealoader.init ({
ID: "Example_1"//ID of the textarea to transform
, Start_highlight:true//If start with highlight
, Allow_resize: "Both"
, Allow_toggle:true
, Word_wrap:true
, language: "en"//internationalization
, syntax: "JS"//code style, support JS, Php,sql,
The following are formatted support
, Begin_toolbar: "btn_beautifier,|"//Insert Toolbar
, plugins: "Beautifier"//Using controls
});
</script>

You can edit the code box in the page

Can solve the first and second problems, but it can be solved.

So I looked for and found this site: http://jsbeautifier.org/. This website makes a JS formatting tool, can even format the JS code that has been confused by some obfuscation.

So I based on the above items in the plug-in specification, the two Dongdong integration. Look at the button in the picture above and press it, it becomes

Look, the highlights and formatting are all there.

Download can be downloaded from here (the plugin already contains code formatting):editarea_0_8_2.zip

examples See \exemples\example.html

Formatted Plug-ins implemented in \edit_area\plugins\beautifier\beautifier.js