在b/s開發中經常用到的javascript技術

在b/s開發中經常用到的javascript技術
一、驗證類
1、數字驗證內
1.1 整數
1.2 大於0的整數 （用於傳來的ID的驗證)
1.3 負整數的驗證
1.4 整數不能大於iMax
1.5 整數不能小於iMin
2、時間類
2.1 短時間，形如 (13:04:06)
2.2 短日期，形如 (2003-12-05)
2.3 長時間，形如 (2003-12-05 13:04:06)
2.4 只有年和月。形如(2003-05,或者2003-5)
2.5 只有小時和分鐘,形如(12:03)
3、表單類
3.1 所有的表單的值都不能爲空
3.2 多行文本框的值不能爲空。
3.3 多行文本框的值不能超過sMaxStrleng
3.4 多行文本框的值不能少於sMixStrleng
3.5 判斷單選框是否選擇。
3.6 判斷複選框是否選擇.
3.7 複選框的全選，多選，全不選，反選
3.8 文件上傳過程中判斷文件類型
4、字符類
4.1 判斷字符全部由a-Z或者是A-Z的字字母組成
4.2 判斷字符由字母和數字組成。
4.3 判斷字符由字母和數字，下劃線,點號組成.且開頭的只能是下劃線和字母
4.4 字符串替換函數.Replace();
5、瀏覽器類
5.1 判斷瀏覽器的類型
5.2 判斷ie的版本
5.3 判斷客戶端的分辨率

6、結合類
6.1 email的判斷。
6.2 手機號碼的驗證
6.3 身份證的驗證


二、功能類

1、時間與相關控件類
1.1 日曆
1.2 時間控件
1.3 萬年曆
1.4 顯示動態顯示時鐘效果（文本，如OA中時間）
1.5 顯示動態顯示時鐘效果 (圖像，像手錶)
2、表單類
2.1 自動生成表單
2.2 動態添加，修改，刪除下拉框中的元素
2.3 可以輸入內容的下拉框
2.4 多行文本框中只能輸入iMax文字。如果多輸入了，自動減少到iMax個文字（多用於短信發送)

3、打印類
3.1 打印控件
4、事件類
4.1 屏蔽右鍵
4.2 屏蔽所有功能鍵
4.3 --> 和<-- F5 F11,F9,F1
4.4 屏蔽組合鍵ctrl+N
5、網頁設計類
5.1 連續滾動的文字，圖片（注意是連續的，兩段文字和圖片中沒有空白出現）
5.2 html編輯控件類
5.3 顏色選取框控件
5.4 下拉菜單
5.5 兩層或多層次的下拉菜單
5.6 仿IE菜單的按鈕。（效果如rongshuxa.com的導航欄目)
5.7 狀態欄，title欄的動態效果（例子很多，可以研究一下）
5.8 雙擊後，網頁自動滾屏
6、樹型結構。
6.1 asp+SQL版
6.2 asp+xml+sql版
6.3 java+sql或者java+sql+xml
7、無邊框效果的製作
8、連動下拉框技術
9、文本排序

一、驗證類
1、數字驗證內
1.1 整數
/^(-|/+)?/d+$/.test(str)
1.2 大於0的整數 （用於傳來的ID的驗證)
/^/d+$/.test(str)
1.3 負整數的驗證
/^-/d+$/.test(str)
2、時間類
2.1 短時間，形如 (13:04:06)
function isTime(str)
{
var a = str.match(/^(/d{1,2})(:)?(/d{1,2})/2(/d{1,2})$/);
if (a == null) {alert('輸入的參數不是時間格式'); return false;}
if (a[1]>24 || a[3]>60 || a[4]>60)
{
alert("時間格式不對");
return false
}
return true;
}
2.2 短日期，形如 (2003-12-05)
function strDateTime(str)
{
 var r = str.match(/^(/d{1,4})(-|//)(/d{1,2})/2(/d{1,2})$/);
 if(r==null)return false;
 var d= new Date(r[1], r[3]-1, r[4]);
 return (d.getFullYear()==r[1]&&(d.getMonth()+1)==r[3]&&d.getDate()==r[4]);
}
2.3 長時間，形如 (2003-12-05 13:04:06)
function strDateTime(str)
{
var reg = /^(/d{1,4})(-|//)(/d{1,2})/2(/d{1,2}) (/d{1,2}):(/d{1,2}):(/d{1,2})$/;
var r = str.match(reg);
if(r==null)return false;
var d= new Date(r[1], r[3]-1,r[4],r[5],r[6],r[7]);
return (d.getFullYear()==r[1]&&(d.getMonth()+1)==r[3]&&d.getDate()==r[4]&&d.getHours()==r[5]&&d.getMinutes()==r[6]&&d.getSeconds()==r[7]);
}
2.4 只有年和月。形如(2003-05,或者2003-5)
2.5 只有小時和分鐘,形如(12:03)
3、表單類
3.1 所有的表單的值都不能爲空
<input οnblur="if(this.value.replace(/^/s+|/s+$/g,'')=='')alert('不能爲空!')">
3.2 多行文本框的值不能爲空。
3.3 多行文本框的值不能超過sMaxStrleng
3.4 多行文本框的值不能少於sMixStrleng
3.5 判斷單選框是否選擇。
3.6 判斷複選框是否選擇.
3.7 複選框的全選，多選，全不選，反選
3.8 文件上傳過程中判斷文件類型
4、字符類
4.1 判斷字符全部由a-Z或者是A-Z的字字母組成
<input οnblur="if(/[^a-zA-Z]/g.test(this.value))alert('有錯')">
4.2 判斷字符由字母和數字組成。
<input οnblur="if(/[^0-9a-zA-Z]/g.test(this.value))alert('有錯')">
4.3 判斷字符由字母和數字，下劃線,點號組成.且開頭的只能是下劃線和字母
/^([a-zA-z_]{1})([/w]*)$/g.test(str)
4.4 字符串替換函數.Replace();
5、瀏覽器類
5.1 判斷瀏覽器的類型
window.navigat or.appName
5.2 判斷ie的版本
window.navigat or.appVersion
5.3 判斷客戶端的分辨率
window.screen.height;window.screen.width;

6、結合類
6.1 email的判斷。
function ismail(mail)
{
return(new RegExp(/^/w+((-/w+)|(/./w+))*/@[A-Za-z0-9]+((/.|-)[A-Za-z0-9]+)*/.[A-Za-z0-9]+$/).test(mail));
}
6.2 手機號碼的驗證
6.3 身份證的驗證
function isIdCardNo(num)
{
if (isNaN(num)) {alert("輸入的不是數字！"); return false;}
var len = num.length, re;
if (len == 15)
re = new RegExp(/^(/d{6})()?(/d{2})(/d{2})(/d{2})(/d{3})$/);
else if (len == 18)
re = new RegExp(/^(/d{6})()?(/d{4})(/d{2})(/d{2})(/d{3})(/d)$/);
else {alert("輸入的數字位數不對！"); return false;}
var a = num.match(re);
if (a != null)
{
if (len==15)
{
var D = new Date("19"+a[3]+"/"+a[4]+"/"+a[5]);
var B = D.getYear()==a[3]&&(D.getMonth()+1)==a[4]&&D.getDate()==a[5];
}
else
{
var D = new Date(a[3]+"/"+a[4]+"/"+a[5]);
var B = D.getFullYear()==a[3]&&(D.getMonth()+1)==a[4]&&D.getDate()==a[5];
}
if (!B) {alert("輸入的身份證號 "+ a[0] +" 裏出生日期不對！"); return false;}
}
return true;
}

3.7 複選框的全選，多選，全不選，反選
<f orm name=hrong>
<input type=checkbox name=All οnclick="checkAll('mm')">全選<br/>
<input type=checkbox name=mm οnclick="checkItem('All')"><br/>
<input type=checkbox name=mm οnclick="checkItem('All')"><br/>
<input type=checkbox name=mm οnclick="checkItem('All')"><br/>
<input type=checkbox name=mm οnclick="checkItem('All')"><br/>
<input type=checkbox name=mm οnclick="checkItem('All')"><br/><br/>

<input type=checkbox name=All2 οnclick="checkAll('mm2')">全選<br/>
<input type=checkbox name=mm2 οnclick="checkItem('All2')"><br/>
<input type=checkbox name=mm2 οnclick="checkItem('All2')"><br/>
<input type=checkbox name=mm2 οnclick="checkItem('All2')"><br/>
<input type=checkbox name=mm2 οnclick="checkItem('All2')"><br/>
<input type=checkbox name=mm2 οnclick="checkItem('All2')"><br/>

</f orm>

<SCRIPT LANGUAGE="java script">
function checkAll(str)
{
var a = document．getElementsByName(str);
var n = a.length;
f or (var i=0; i<n; i++)
a[i].checked = window.event.srcElement.checked;
}
function checkItem(str)
{
var e = window.event.srcElement;
var all = eval("document．hrong."+ str);
if (e.checked)
{
var a = document．getElementsByName(e.name);
all.checked = true;
f or (var i=0; i<a.length; i++)
{
if (!a[i].checked){ all.checked = false; break;}
}
}
else all.checked = false;
}
</SCRIPT>

3.8 文件上傳過程中判斷文件類型
<input type=file οnchange="alert(this.value.match(/^(.*)(/.)(.{1,8})$/)[3])">

畫圖:
<OBJECT
id=S
style="LEFT: 0px; WIDTH: 392px; TOP: 0px; HEIGHT: 240px"
height=240
width=392
classid="clsid:369303C2-D7AC-11D0-89D5-00A0C90833E6">
</OBJECT>
<SCRIPT>
S.DrawingSurface.ArcDegrees(0,0,0,30,50,60);
S.DrawingSurface.ArcRadians(30,0,0,30,50,60);
S.DrawingSurface.Line(10,10,100,100);
</SCRIPT>

寫註冊表：
<SCRIPT>
var WshShell = WScript.CreateObject("WScript.Shell");
WshShell.RegWrite ("HKCU//Software//ACME//F ortuneTeller//", 1, "REG_BINARY");
WshShell.RegWrite ("HKCU//Software//ACME//F ortuneTeller//MindReader", "Goocher!", "REG_SZ");
var bKey =WshShell.RegRead ("HKCU//Software//ACME//F ortuneTeller//");
WScript.Echo (WshShell.RegRead ("HKCU//Software//ACME//F ortuneTeller//MindReader"));
WshShell.RegDelete ("HKCU//Software//ACME//F ortuneTeller//MindReader");
WshShell.RegDelete ("HKCU//Software//ACME//F ortuneTeller//");
WshShell.RegDelete ("HKCU//Software//ACME//");
</SCRIPT>

TABLAE相關(客戶端動態增加行列）
<HTML>
<SCRIPT LANGUAGE="JScript">
function numberCells() {
var count=0;
f or (i=0; i < document．all.mytable.rows.length; i++) {
f or (j=0; j < document．all.mytable.rows(i).cells.length; j++) {
document．all.mytable.rows(i).cells(j).innerText = count;
count++;
}
}
}
</SCRIPT>
<BODY οnlοad="numberCells()">
<TABLE id=mytable b order=1>
<TR><TH> </TH><TH> </TH><TH> </TH><TH> </TH></TR>
<TR><TD> </TD><TD> </TD><TD> </TD><TD> </TD></TR>
<TR><TD> </TD><TD> </TD><TD> </TD><TD> </TD></TR>
</TABLE>
</BODY>
</HTML>

１．身份證嚴格驗證：

<script>
var aCity={11:"北京",12:"天津",13:"河北",14:"山西",15:"內蒙古",21:"遼寧",22:"吉林",23:"黑龍江",31:"上海",32:"江蘇",33:"浙江",34:"安徽",35:"福建",36:"江西",37:"山東",41:"河南",42:"湖北",43:"湖南",44:"廣東",45:"廣西",46:"海南",50:"重慶",51:"四川",52:"貴州",53:"雲南",54:"西藏",61:"陝西",62:"甘肅",63:"青海",64:"寧夏",65:"新疆",71:"臺灣",81:"香港",82:"澳門",91:"國外"}

function cidInfo(sId){
var iSum=0
var info=""
if(!/^/d{17}(/d|x)$/i.test(sId))return false;
sId=sId.replace(/x$/i,"a");
if(aCity[parseInt(sId.substr(0,2))]==null)return "Err or:非法地區";
sBirthday=sId.substr(6,4)+"-"+Number(sId.substr(10,2))+"-"+Number(sId.substr(12,2));
var d=new Date(sBirthday.replace(/-/g,"/"))
if(sBirthday!=(d.getFullYear()+"-"+ (d.getMonth()+1) + "-" + d.getDate()))return "Err or:非法生日";
f or(var i = 17;i>=0;i --) iSum += (Math.pow(2,i) % 11) * parseInt(sId.charAt(17 - i),11)
if(iSum%11!=1)return "Err or:非法證號";
return aCity[parseInt(sId.substr(0,2))]+","+sBirthday+","+(sId.substr(16,1)%2?"男":"女")
}

document．write(cidInfo("380524198002300016"),"<br/>");
document．write(cidInfo("340524198002300019"),"<br/>")
document．write(cidInfo("340524197711111111"),"<br/>")
document．write(cidInfo("34052419800101001x"),"<br/>");
</script>

２．驗證ＩＰ地址
<SCRIPT LANGUAGE="java script">
function isip(s){
var check=function(v){try{return (v<=255 && v>=0)}catch(x){return false}};
var re=s.split(".")
return (re.length==4)?(check(re[0]) && check(re[1]) && check(re[2]) && check(re[3])):false
}

var s="202.197.78.129";
alert(isip(s))
</SCRIPT>

 

３．加sp1後還能用的無邊框窗口！！
<HTML XMLNS:IE>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<IE:Download ID="include" STYLE="behavi or:url(#default#download)" />
<title>Chromeless Window</title>

<SCRIPT LANGUAGE="JScript">
/*--- Special Thanks F or andot ---*/

/*
This following code are designed and writen by Windy_sk <[email protected]>
You can use it freely, but u must held all the copyright items!
*/

/*--- Thanks F or andot Again ---*/

var CW_width = 400;
var CW_height = 300;
var CW_top = 100;
var CW_left = 100;
var CW_url = "/";
var New_CW = window.createPopup();
var CW_Body = New_CW.document．body;
var content = "";
var CSStext = "margin:1px;col or:black; b order:2px outset;b order-style:expression(οnmοuseοut=οnmοuseup=function(){this.style.b orderStyle='outset'}, οnmοusedοwn=function(){if(event.button!=2)this.style.b orderStyle='inset'});background-col or:buttonface;width:16px;height:14px;font-size:12px;line-height:11px;curs or:Default;";

//Build Window
include.startDownload(CW_url, function(source){content=source});

function insert_content(){
var temp = "";
CW_Body.style.overflow= "hidden";
CW_Body.style.backgroundCol or = "white";
CW_Body.style.b order="solid black 1px";
content = content.replace(/<a ([^>]*)>/g,"<a οnclick='parent.open(this.href);return false' $1>");
temp += "<table width=100% height=100% cellpadding=0 cellspacing=0 b order=0>";
temp += "<tr style=';font-size:12px;background:#0099CC;height:20;curs or:default' οndblclick=/"Max.innerText=Max.innerText=='1'?'2':'1';parent.if_max=!parent.if_max;parent.show_CW();/" οnmοuseup='parent.drag_up(event)' οnmοusemοve='parent.drag_move(event)' οnmοusedοwn='parent.drag_down(event)' onselectstart='return false' οncοntextmenu='return false'>";
temp += "<td style='col or:#ffffff;padding-left:5px'>Chromeless Window F or IE6 SP1</td>";
temp += "<td style='col or:#ffffff;padding-right:5px;' align=right>";
temp += "<span id=Helpοnclick=/"alert('Chromeless Window F or IE6 SP1-Ver 1.0//n//nCode By Windy_sk//n//nSpecial Thanks F or andot')/" style=/""+CSStext+"font-family:System;padding-right:2px;/">?</span>";
temp += "<span id=Min οnclick='parent.New_CW.hide();parent.blur()' style=/""+CSStext+"font-family:Webdings;/" title='Minimum'>0</span>";
temp += "<span id=Max οnclick=/"this.innerText=this.innerText=='1'?'2':'1';parent.if_max=!parent.if_max;parent.show_CW();/" style=/""+CSStext+"font-family:Webdings;/" title='Maximum'>1</span>";
temp += "<span id=Close οnclick='parent.opener=null;parent.close()' style=/""+CSStext+"font-family:System;padding-right:2px;/" title='Close'>x</span>";
temp += "</td></tr><tr><td colspan=2>";
temp += "<div id=include style='overflow:scroll;overflow-x:hidden;overflow-y:auto; HEIGHT: 100%; width:"+CW_width+"'>";
temp += content;
temp += "</div>";
temp += "</td></tr></table>";
CW_Body.innerHTML = temp;
}

setTimeout("insert_content()",1000);

var if_max = true;
function show_CW(){
window.moveTo(10000, 10000);
if(if_max){
New_CW.show(CW_top, CW_left, CW_width, CW_height);
if(typeof(New_CW.document．all.include)!="undefined"){
 New_CW.document．all.include.style.width = CW_width;
 New_CW.document．all.Max.innerText = "1";
}

}else{
New_CW.show(0, 0, screen.width, screen.height);
New_CW.document．all.include.style.width = screen.width;
}
}

window.onfocus= show_CW;
window.onresize = show_CW;

// Move Window
var drag_x,drag_y,draging=false

function drag_move(e){
if (draging){
New_CW.show(e.screenX-drag_x, e.screenY-drag_y, CW_width, CW_height);
return false;
}
}

function drag_down(e){
if(e.button==2)return;
if(New_CW.document．body.offsetWidth==screen.width && New_CW.document．body.offsetHeight==screen.height)return;
drag_x=e.clientX;
drag_y=e.clientY;
draging=true;
e.srcElement.setCapture();
}

function drag_up(e){
draging=false;
e.srcElement.releaseCapture();
if(New_CW.document．body.offsetWidth==screen.width && New_CW.document．body.offsetHeight==screen.height) return;
CW_top= e.screenX-drag_x;
CW_left = e.screenY-drag_y;
}

</SCRIPT>
</HTML>

電話號碼的驗證

要求：
　　(1)電話號碼由數字、"("、")"和"-"構成
　　(2)電話號碼爲3到8位
　　(3)如果電話號碼中包含有區號，那麼區號爲三位或四位
　　(4)區號用"("、")"或"-"和其他部分隔開
　　(5)移動電話號碼爲11或12位，如果爲12位,那麼第一位爲0
　　(6)11位移動電話號碼的第一位和第二位爲"13"
　　(7)12位移動電話號碼的第二位和第三位爲"13"
　　根據這幾條規則，可以與出以下正則表達式：
　　(^[0-9]{3,4}/-[0-9]{3,8}$)|(^[0-9]{3,8}$)|(^/([0-9]{3,4}/)[0-9]{3,8}$)|(^0{0,1}13[0-9]{9}$)

<script language="java script">
function PhoneCheck(s) {
var str=s;
var reg=/(^[0-9]{3,4}/-[0-9]{3,8}$)|(^[0-9]{3,8}$)|(^/([0-9]{3,4}/)[0-9]{3,8}$)|(^0{0,1}13[0-9]{9}$)/
alert(reg.test(str));
}
</script>
<input type=text name="iphone">
<input type=button οnclick="PhoneCheck(document．all.iphone.value)" value="Check">

具有在輸入非數字字符不回顯的效果，即對非數字字符的輸入不作反應。
function numbersonly(field,event){
var key,keychar;
if(window.event){
key = window.event.keyCode;
}
else if (event){
key = event.which;
}
else{
return true
}
keychar = String.fromCharCode(key);
if((key == null)||(key == 0)||(key == 8)||(key == 9)||(key == 13)||(key == 27)){
return true;
}
else if(("0123456789.").indexOf(keychar)>-1){
window.status = "";
return true;
}
else {
window.status = "Field excepts numbers only";
return false;
}
}

驗證ip

str=document．RegExpDemo.txtIP.value;
if(/^(/d{1,3})/.(/d{1,3})/.(/d{1,3})/.(/d{1,3})$/.test(str)==false)
{
window.alert('錯誤的IP地址格式');
document．RegExpDemo.txtIP.select();
document．RegExpDemo.txtIP.focus();
return;
}
if(RegExp.$1<1 || RegExp.$1>254||RegExp.$2<0||RegExp.$2>254||RegExp.$3<0||RegExp.$3>254||RegExp.$4<1||RegExp.$4>254)
{
window.alert('錯誤的IP地址');
document．RegExpDemo.txtIP.select();
document．RegExpDemo.txtIP.focus();
return;
}
//剔除 如010.020.020.03 前面 的0
var str=str.replace(/0(/d)/g,"$1");
str=str.replace(/0(/d)/g,"$1");
window.alert(str);

//一下是取數據的類
//Obj參數指定數據的來源(限定Table),默認第一行爲字段名稱行
//GetTableData類提供MoveNext方法,參數是表的行向上或向下移動的位數,正數向下移動,負數向上.
//GetFieldData方法獲得指定的列名的數據
//S ort_desc方法對指定的列按降序排列
//S ort_asc方法對指定的列按升序排列
//GetData方法返回字段值爲特定值的數據數組,提供數據,可以在外部進行其他處理
//Delete方法刪除當前記錄,數組減少一行
//初始化,Obj:table的名字,Leftlen:左面多餘數據長度,Rightlen:右面多餘數據長度,
function GetTableData(Obj,LeftLen,RightLen){
var MyObj=document．all(Obj);
var iRow=MyObj.rows.length;
var iLen=MyObj.rows[0].cells.length;
var i,j;

TableData=new Array();
f or (i=0;i< iRow;i++){
 TableData[i]=new Array();
 f or (j=0;j<iLen;j++){
 TableStr=MyObj.rows(i).cells(j).innerText;
 TableStr=TableStr.substring(LeftLen, TableStr.length-RightLen).Trim();
 TableStr=TableStr.replace(/ /gi,"").replace(//r/n/ig,"");
 TableData[i][j]=TableStr;
 }
 }

this.TableData=TableData;
this.cols=this.TableData[0].length;
this.rows=this.TableData.length;
this.rowindex=0;
}

function movenext(Step){
if (this.rowindex>=this.rows){
return
}

if (Step=="" || typeof(Step)=="undefined") {
if (this.rowindex<this.rows-1)
this.rowindex++;
return;

}
else{
if (this.rowindex + Step<=this.rows-1 && this.rowindex + Step>=0 ){
this.rowindex=this.rowindex + Step;
}
else
{
if (this.rowindex + Step<0){
 this.rowindex= 0;
 return;
 }
if (this.rowindex + Step>this.rows-1){
 this.rowindex= this.rows-1;
 return;
 }
}
}
}

function getfielddata(Field){
var colindex=-1;
var i=0;
if (typeof(Field) == "number"){
 colindex=Field;
}
else
{
f or (i=0;i<this.cols && this.rowindex<this.rows ;i++){
 if (this.TableData[0][i]==Field){
 colindex=i;
 break;
 }
}
}
if (colindex!=-1) {
return this.TableData[this.rowindex][colindex];
}

}

 

function s ort_desc(){//降序
var colindex=-1;
var highindex=-1;
desc_array=new Array();
var i,j;
f or (n=0; n<arguments.length; n++){
Field=arguments[arguments.length-1-n];
f or (i=0;i<this.cols;i++){
if (this.TableData[0][i]==Field){
colindex=i;
break;
}
}
 if ( colindex==-1 )
return;
 else
{
desc_array[0]=this.TableData[0];
f or(i=1;i<this.rows;i++){
desc_array[i]=this.TableData[1];
highindex=1;
 f or(j=1;j<this.TableData.length;j++){
if(desc_array[i][colindex]<this.TableData[j][colindex]){
desc_array[i]=this.TableData[j];
highindex=j;
}

 }
 if (highindex!=-1)
 this.TableData=this.TableData.slice(0,highindex).concat(this.TableData.slice(highindex+1,this.TableData.length));
}
}

this.TableData=desc_array;
}
return;
}

 

function s ort_asc(){//升序
var colindex=-1;
var highindex=-1;
var i,j;
f or (n=0; n<arguments.length; n++){
 asc_array=new Array();
 Field=arguments[arguments.length-1-n];
 f or (i=0;i<this.cols;i++){
if (this.TableData[0][i]==Field){
colindex=i;
break;
}
 }
 if ( colindex==-1 )
 return;
 else
 {
 asc_array[0]=this.TableData[0];
 f or(i=1;i<this.rows;i++){
 asc_array[i]=this.TableData[1];
 highindex=1;
f or(j=1;j<this.TableData.length;j++){//找出最小的列值
 if(asc_array[i][colindex]>this.TableData[j][colindex]){
 asc_array[i]=this.TableData[j];
 highindex=j;

}

 }
 if (highindex!=-1)
 this.TableData=this.TableData.slice(0,highindex).concat(this.TableData.slice(highindex+1,this.TableData.length));

}
 }

this.TableData=asc_array;
}
return;
}

 

function getData(Field,Fieldvalue){
var colindex=-1;
var i,j;

GetData=new Array();
if (typeof(Field)=="undefined" || typeof(Fieldvalue)=="undefined" ){
return this.TableData;
}

 f or(j=0;j<this.cols;j++){
if(this.TableData[0][j]==Field){
 colindex=j;
 }
 }
 if (colindex!=-1){

 f or(i=1;i<this.rows;i++){
if(this.TableData[i][colindex]==Fieldvalue){
 GetData[i]=new Array();
 GetData[i]=this.TableData[i];
 }
 }
 }
 return GetData;
}
function DeletE(){
this.TableData=this.TableData.slice(0,this.rowindex).concat(this.TableData.slice(this.rowindex+1,this.TableData.length));
this.rows=this.TableData.length;
return;
}
function updateField(Field,Fieldvalue){
var colindex=-1;
var i=0;
if (typeof(Field) == "number"){
 colindex=Field;
}
else
{
f or (i=0;i<this.cols && this.rowindex<this.rows ;i++){
 if (this.TableData[0][i]==Field){
 colindex=i;
 break;
 }
}
}
if (colindex!=-1) {
this.TableData[this.rowindex][colindex]=Fieldvalue;
}

}
function movefirst(){
this.rowindex=0;
}
function movelast(){
this.rowindex=this.rows-1;
}
function String.prototype.Trim() {return this.replace(/(^/s*)|(/s*$)/g,"");}
GetTableData.prototype.MoveNext = movenext;
GetTableData.prototype.GetFieldData = getfielddata;
GetTableData.prototype.S ort_asc = s ort_asc;
GetTableData.prototype.S ort_desc = s ort_desc;
GetTableData.prototype.GetData = getData;
GetTableData.prototype.Delete = DeletE;
GetTableData.prototype.UpdateField = updateField;
GetTableData.prototype.MoveFirst = movefirst;

具體的例子：http://202.119.73.208/NetEAn/com/test/jsprint.htm

在每個文本框的onblur事件中調用校驗代碼,並且每個文本框中onKeyDown事件中寫一個enter轉tab函數

//回車鍵換爲tab
function enterToTab()
{
if(event.srcElement.type != 'button' && event.srcElement.type != 'textarea'
 && event.keyCode == 13)
{
event.keyCode = 9;
}
}

有時候還需要自由編輯表格---
給大家一個自由編輯表格的小例子,寫的有點亂,呵呵:）

//===============================start================================

<HTML>
<HEAD>
<META http-equiv="Content-Type" content="text/html; charset=gb2312">
<TITLE>測試修改表格</TITLE>
<STYLE>
/*提示層的樣式*/
div
{
BORDER-RIGHT: #80c144 1px solid;
BORDER-TOP: #80c144 1px solid;
VISIBILITY: hidden;
BORDER-LEFT: #80c144 1px solid;
CURSOR: default;
LINE-HEIGHT: 20px;
BORDER-BOTTOM: #80c144 1px solid;
FONT-FAMILY: 宋體;
font-size:12px;
POSITION: absolute;
BACKGROUND-COLOR: #f6f6f6;
TOP:30px;
LEFT:30px;
}
/*tr的樣式*/
tr
{
font-family: "宋體";
col or: #000000;
background-col or: #C1DBF5;
font-size: 12px
}
/*table腳註樣式*/
.TrFoot
{
FONT-SIZE: 12px;
font-family:"宋體", "Verdana", "Arial";
BACKGROUND-COLOR: #6699CC;
COLOR:#FFFFFF;
height: 25;
}
/*trhead屬性*/
.TrHead
{
FONT-SIZE: 13px;
font-family:"宋體", "Verdana", "Arial";
BACKGROUND-COLOR: #77AADD;
COLOR:#FFFFFF;
height: 25;
}
/*文本框樣式*/
INPUT
{
BORDER-COLOR: #AACEF7 #AACEF7 #AACEF7 #AACEF7;
BORDER-RIGHT: 1px solid;
BORDER-TOP: 1px solid;
BORDER-LEFT: 1px solid;
BORDER-BOTTOM: 1px solid;
FONT-SIZE: 12px;
FONT-FAMILY: "宋體","Verdana";
col or: #000000;
BACKGROUND-COLOR: #E9EFF5;
}
/*button樣式*/
button
{
BORDER-COLOR: #AACEF7 #AACEF7 #AACEF7 #AACEF7;
BACKGROUND-COLOR: #D5E4F3;
CURSOR: hand;
FONT-SIZE:12px;
BORDER-RIGHT: 1px solid;
BORDER-TOP: 1px solid;
BORDER-LEFT: 1px solid;
BORDER-BOTTOM: 1px solid;
COLOR: #000000;
}
</STYLE>
</HEAD>
<BODY>
<SCRIPT language = "java script">
<!--全局變量
//標誌位,值爲false代表未打開一個編輯框,值爲true爲已經打開一個編輯框開始編輯
var editer_table_cell_tag = false;
//開啓編輯功能標誌,值爲true時爲允許編輯
var run_edit_flag = false;
//-->
</SCRIPT>

<SCRIPT language = "java script">
<!--
/**
* 編輯表格函數
* 單擊某個單元格可以對裏面的內容進行自由編輯
* @para tableID 爲要編輯的table的id
* @para noEdiID 爲不要編輯的td的ID,比如說table的標題
* 可以寫爲<TD id="no_editer">自由編輯表格</TD>
* 此時該td不可編輯
*/
function editerTableCell(tableId,noEdiId)
{
var tdObject = event.srcElement;
var tObject = ((tdObject.parentNode).parentNode).parentNode;
if(tObject.id == tableId &&tdObject.id != noEdiId&&editer_table_cell_tag == false && run_edit_flag == true)
{
tdObject.innerHTML = "<input type=text id=edit_table_txt name=edit_table_txt value="+tdObject.innerText+" size='15' onKeyDown='enterToTab()'><input type=button value=' 確定 ' οnclick='certainEdit()'>";
edit_table_txt.focus();
edit_table_txt.select();
editer_table_cell_tag = true;
//修改按鈕提示信息
editTip.innerText = "請先點確定按鈕確認修改!";
}
else
{
return false;
}
}

/**
* 確定修改
*/
function certainEdit()
{
var bObject = event.srcElement;
var tdObject = bObject.parentNode;
var txtObject = tdObject.firstChild;
tdObject.innerHTML = txtObject.value;
//代表編輯框已經關閉
editer_table_cell_tag = false;
//修改按鈕提示信息
editTip.innerText = "請單擊某個單元格進行編輯!";
}

function enterToTab()
{
if(event.srcElement.type != 'button' && event.srcElement.type != 'textarea'
 && event.keyCode == 13)
{
event.keyCode = 9;
}
}

/**
* 控制是否編輯
*/
function editStart()
{
if(event.srcElement.value == "開始編輯")
{
event.srcElement.value = "編輯完成";
run_edit_flag = true;
}
else
{
//如果當前沒有編輯框,則編輯成功,否則,無法提交
//必須按確定按鈕後才能正常提交
if(editer_table_cell_tag == false)
{
 alert("編輯成功結束!");
 event.srcElement.value = "開始編輯";
 run_edit_flag = false;
}
}
}

/**
* 根據不同的按鈕提供不同的提示信息
*/
function showTip()
{
if(event.srcElement.value == "編輯完成")
{
editTip.style.top = event.y + 15;
editTip.style.left = event.x + 12;
editTip.style.visibility = "visible";
}
else
{
editTip.style.visibility = "hidden";
}
}
-->
</SCRIPT>
<TABLE id="editer_table" width="100%" align="center"
οnclick="editerTableCell('editer_table','no_editer')">
<TR class="TrHead">
<TD colspan="3" align="center" id="no_editer">自由編輯表格</TD>
</TR>
<TR>
<TD width="33%">單擊開始編輯按鈕,然後點擊各單元格編輯</TD>
<TD width="33%">2</TD>
<TD width="33%">3</TD>
</TR>
<TR>
<TD width="33%">4</TD>
<TD width="33%">5</TD>
<TD width="33%">6</TD>
</TR>
<TR>
<TD width="33%">one</TD>
<TD width="33%">two</TD>
<TD width="33%">three</TD>
</TR>
<TR>
<TD width="33%">four</TD>
<TD width="33%">five</TD>
<TD width="33%">six</TD>
</TR>
<TR class="TrFoot">
<TD colspan="3" align="center" id="no_editer">
 <INPUT type="button" class="bt" value="開始編輯" onClick="editStart()" onMouseOver="showTip()" onMouseMove="showTip()" onMouseOut="editTip.style.visibility = 'hidden';">
</TD>
</TR>
</TABLE>
</BODY>
<DIV id="editTip">請單擊某個單元格進行編輯!</DIV>
</HTML>