对于edit_area的使用

对于一些比较大型的项目来说,做一些梳理有助于了解项目中技术优势:
究竟怎么才能把项目中的代码展示出来呢,这里介绍一下EditArea,它是一个javascript源代码编辑器。支持:文本格式化,搜索与替换,实时语法着色加亮。当前支持的语言包括:PHP、CSS、Javascript、Python、HTML、XML、VB、C、CPP、SQL、Pascal、Basic、Brainf*ck。
实例展示: http://www.cdolivet.com/editarea/editarea/exemples/exemple_full.html

该能够定位到你想看的文件,甚至是某一行代码,某一个功能模块及某一个工具类!
其实实例展示当中的功能很多,我学习过程中做了一个能够展示代码,并定位到某一行的功能以下稍作一点展示:
首先找到自己要使用的功能单元
对实例展示当中的功能简化如下:
<title>文件定位</title>
<script type="text/javascript" src="<c:url value='/edit_area/edit_area_full.js'/>"></script>
<script 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: false
	,toolbar: "search, go_to_line, fullscreen, |, undo, redo, |, select_font,|, change_smooth_selection, highlight, reset_highlight"
	,language: "en"
	,syntax: "${fileType}"	
	,EA_load_callback: "goL(${line})"
});

function toogle_editable(id)
{
	editAreaLoader.execCommand(id, 'set_editable', !editAreaLoader.execCommand(id, 'is_editable'));
}
function   goL(line)    
{   
	var example_1 = document.getElementById("example_1");
	var v = example_1.value.split('\r\n');   
	 ch = 0;    
	for(var   i=0;i < line-1;i++) {    
		ch+=v[i].length+2;
	}
	editAreaLoader.setSelectionRange("example_1", ch, ch);	  
}    

</script>
</head>
<body leftmargin="0" rightmargin="0" >

	<fieldset>
		<legend>${fileName}</legend>
        <legend>${relativePath}</legend>
		<textarea id="example_1" style="height: 500px; width: 100%;" name="test_1" >
${fieldset}
		</textarea>		
	</fieldset>
</body>

只要把你想看的文件读出来就能通过以上的功能块展示出你想看到的源码了!

你可能感兴趣的:(JavaScript,python,css,vb,pascal)