这个东西是在线写 js 脚本的时候，用来即时查错的东西！
也就是，当发现所编写的脚本有问题的时候会有相应的提示，并且在源代码框中高亮标示出错行，方便除错
1<html>
2<head>
3<title>Debug Textarea</title>
4<meta content="text/html; charset=utf-8" http-equiv="Content-Type"/>
5</head>
6<style>
7* {
8font-size: 12px
9}
10body {
11margin: 10px; padding: 0px
12}
13table.list{
14cursor: default;
15border:1px solid #cccccc
16background-color: #cccccc;
17border-collapse: collapse;
18border-Color: #cccccc;
19}
20</style>
21<script language="javascript">
22// Coded by windy_sk <[email protected]> 20040205
23
24function reportError(msg,url,line) {
25var str = "You have found an error as below: \n\n";
26str += "Err: " + msg + " on line: " + line;
27alert(str);
28return true;
29}
30
31window.onerror = reportError;
32
33
34document.onkeydown = function() {
35if(event.ctrlKey){
36switch(event.keyCode) {
37case 82: //r
38runcode();
39break;
40case 83: //s
41savecode();
42break;
43case 71: //g
44goto(prompt('Please input the line number', '1'));
45break;
46case 65: //a
47document.execCommand("SelectAll");
48break;
49case 67: //c
50document.execCommand("Copy");
51break;
52case 88: //x
53document.execCommand("Cut");
54break;
55case 86: //v
56document.execCommand("Paste");
57break;
58case 90: //z
59document.execCommand("Undo");
60break;
61case 89: //y
62document.execCommand("Redo");
63break;
64default:
65break;
66}
67event.keyCode = 0;
68event.returnValue = false;
69}
70return;
71}
72
73
74function show_ln(){
75var txt_ln = document.getElementById('txt_ln');
76var txt_main = document.getElementById('txt_main');
77txt_ln.scrollTop = txt_main.scrollTop;
78while(txt_ln.scrollTop != txt_main.scrollTop) {
79txt_ln.value += (i++) + '\n';
80txt_ln.scrollTop = txt_main.scrollTop;
81}
82return;
83}
84
85
86function editTab(){
87var code, sel, tmp, r;
88event.returnValue = false;
89sel =event.srcElement.document.selection.createRange();
90r = event.srcElement.createTextRange();
91
92switch (event.keyCode){
93case (8) :
94if (!(sel.getClientRects().length > 1)){
95event.returnValue = true;
96return;
97}
98code = sel.text;
99tmp = sel.duplicate();
100tmp.moveToPoint(r.getBoundingClientRect().left, sel.getClientRects()[0].top);
101if(sel.parentElement() != tmp.parentElement()) return;;
102sel.setEndPoint('startToStart', tmp);
103sel.text = sel.text.replace(/^\t/gm, '');
104code = code.replace(/^\t/gm, '').replace(/\r\n/g, '\r');
105r.findText(code);
106r.select();
107break;
108case (9) :
109if (sel.getClientRects().length > 1){
110code = sel.text;
111tmp = sel.duplicate();
112tmp.moveToPoint(r.getBoundingClientRect().left, sel.getClientRects()[0].top);
113if(sel.parentElement() != tmp.parentElement()) return;
114sel.setEndPoint('startToStart', tmp);
115sel.text = '\t'+sel.text.replace(/\r\n/g, '\r\t');
116code = code.replace(/\r\n/g, '\r\t');
117r.findText(code);
118r.select();
119}else{
120sel.text = '\t';
121sel.select();
122}
123break
124case (13) :
125tmp = sel.duplicate();
126tmp.moveToPoint(r.getBoundingClientRect().left, sel.getClientRects()[0].top);
127if(sel.parentElement() != tmp.parentElement()) return;
128tmp.setEndPoint('endToEnd', sel);
129sel.text = '\r\n' + tmp.text.replace(tmp.text.replace(/^[\t ]+/g, ""),"");
130sel.select();
131break;
132default :
133event.returnValue = true;
134break;
135}
136return;
137}
138
139
140function runcode() {
141var str = document.getElementById("txt_main").value;
142var code_win = window.open('about:blank');
143code_win.document.open();
144code_win.document.writeln("<script>");
145code_win.document.writeln("function reportError(msg,url,line){\nline-=14;\nvar str='You have found an error as below: \\\n\\\n';\nstr+='Err : '+msg+' on line: '+(line);\nalert(str);\nopener.goto(line);\nopener.focus();\nwindow.onerror=null;\nsetTimeout('self.close()',10);\nreturn true;\n}");
146code_win.document.writeln("window.onerror = reportError;");
147code_win.document.writeln("<\/script>");
148code_win.document.writeln(str);
149code_win.document.close();
150return;
151}
152
153
154function savecode() {
155var str = document.getElementById("txt_main").value;
156var code_win = window.open('about:blank','_blank','top=10000');
157code_win.document.open();
158code_win.document.writeln(str);
159code_win.document.close();
160code_win.document.execCommand('saveas','','code.html');
161code_win.close();
162return;
163}
164
165
166function goto(ln) {
167if(!/^\d+$/.test(ln) || ln==0) return;
168var obj = document.getElementById("txt_main");
169var rng = obj.createTextRange();
170var arr = obj.value.split(/\n/);
171if(ln>arr.length) ln = arr.length;
172var str_tmp = "";
173for(var i=0; i<ln-1; i++) {
174str_tmp += arr[i];
175}
176rng.moveStart('character',str_tmp.length);
177str_tmp = "";
178for(i=ln; i<arr.length; i++) {
179str_tmp += arr[i];
180}
181rng.moveEnd('character',-str_tmp.length);
182rng.select();
183return;
184}
185
186window.onload = function() {document.getElementById("txt_main").value = "<script>\nalert(')\n<\/script>";}
187</script>
188<body>
189<table bgcolor="#eeeeee" border="1" bordercolordark="#FFFFFF" bordercolorlight="#000000" cellpadding="0" cellspacing="0" class="list" width="600">
190<tr bgcolor="#cccccc">
191<td align="center" colspan="2" height="20"><b>Debug Textarea</b></td>
192</tr>
193<tr>
194<td colspan="2">
195<table align="center" border="0" width="95%">
196<tr>
197<td align="center"><br/>
198<textarea id="txt_ln" name="content" onselectstart="this.nextSibling.focus();return false" readonly="" rows="10" style="width:40px;overflow:hidden;height:200px;border-right:0px;text-align:right;line-height:14px"></textarea><textarea cols="80" id="txt_main" name="content" onkeydown="editTab()" onkeyup="show_ln()" onscroll="show_ln()" rows="10" style="overflow:auto;height:200px;padding-left:5px;border-left:0px;line-height:14px" wrap="off"></textarea>
199<script>for(var i=1; i<=20; i++) document.getElementById('txt_ln').value += i + '\n';</script>
200</td>
201</tr>
202<tr>
203<td align="center"><br/>
204<input accesskey="r" onclick="runcode()" type="button" value=" 运 行 "/>
205<input accesskey="s" onclick="savecode()" type="button" value=" 保 存 "/>
206<input accesskey="g" onclick="goto(prompt('Please input the line number', '1'))" type="button" value=" 跳 转 "/>
207</td>
208</tr>
209</table>
210</td>
211</tr>
212</table>
213</body>
214</html>