网页上的Javascript编辑器和代码格式化_javascript技巧
程序员文章站
2022-05-26 21:59:39
...
为什么不用textarea呢?
1 没有高亮
2 tab键无法使用。——按tab键会切换到下个控件
3 没有代码格式化。——因为习惯了Eclipse的环境,可以使用ctrl+shift+F来代码进行格式化。
当然,我还没强大到自己实现的程度,而且用脚趾头都能想到肯定有人实现了,就看找不找得着。
经过了艰难的搜索,终于在SourceForge上找到一个叫EditArea的项目,感觉挺好。http://sourceforge.net/projects/editarea/
它的sample也很清楚
在网页上用以下方法构造
复制代码 代码如下:
便可以在页面中出现代码的编辑框
能够解决第一个和第二个问题,但是还能解决。
因此我又找啊找,找到这个网站:http://jsbeautifier.org/。这个网站做了一个js的格式化工具,甚至可以格式化经过某个混淆器混淆的js代码。
于是我根据上面项目中的插件规范,将这两个东东整合了起来。看上面图中的按钮,按下以后,就变成了
看,高亮和格式化都有了。
需要下载的可以从这里下载(已经包含代码格式化的插件了):editarea_0_8_2.zip
样例见exemples\example.html
格式化的插件实现在edit_area\plugins\beautifier\beautifier.js
推荐阅读
-
从盛大通行证上摘下来的身份证验证js代码_javascript技巧
-
基于jquery的高性能td和input切换并可修改内容实现代码_javascript技巧
-
最好用的JavaScript开发工具和代码编辑器
-
js获得当前时区夏令时发生和终止的时间代码_javascript技巧
-
js 实现打印网页中定义的部分内容的代码_javascript技巧
-
js 实现打印网页中定义的部分内容的代码_javascript技巧
-
js为数字添加逗号并格式化数字的代码_javascript技巧
-
js/ajax跨越访问-jsonp的原理和实例(javascript和jquery实现代码)_javascript技巧
-
Javascript中3种实现继承的方法和代码实例_javascript技巧
-
js,jQuery 排序的实现代码,网页标签排序的实现,标签排序_javascript技巧