如何在vs.net/c# builder開發(fā)的網(wǎng)頁中也能實(shí)現(xiàn)dos下錄入數(shù)據(jù)回車換行的功能
北京煤炭科學(xué)研究總院經(jīng)濟(jì)與信息研究所 丁報(bào)圣
在dos年代,錄入數(shù)據(jù)時(shí)我們習(xí)慣了在錄入完一行數(shù)據(jù)后敲一個(gè)回車轉(zhuǎn)入下一行的數(shù)據(jù)錄入。昔日dos的輝煌已經(jīng)成為過去,如今更加友好易用的gui圖形操作界面windows已經(jīng)進(jìn)入了我們的日常生活。
1996年windows95的出現(xiàn)是軟件史上的一次偉大革命。windows 是美國微軟公司開發(fā)的一種圖形方式的操作系統(tǒng),它的出現(xiàn)克服了 dos 中難記的一些命令,使計(jì)算機(jī)與人更親近,只要輕輕點(diǎn)擊鼠標(biāo),計(jì)算機(jī)就會(huì)完成一個(gè)動(dòng)作。同時(shí)windows也改變了原先dos下錄入數(shù)據(jù)敲回車的方式,現(xiàn)在我們?nèi)羰窃阡浫霐?shù)據(jù)時(shí)希望光標(biāo)跳到下一行或下一個(gè)輸入框則只能按鍵盤上的tab鍵或用鼠標(biāo)點(diǎn)擊下一個(gè)輸入框。這個(gè)改變對(duì)于沒有接觸過dos操作系統(tǒng)的計(jì)算機(jī)用戶也許沒有什么大的影響,但是對(duì)于從dos下轉(zhuǎn)過來的的計(jì)算機(jī)用戶卻是一個(gè)雞肋;特別是我們的數(shù)據(jù)錄入人員,在dos年代已經(jīng)習(xí)慣在錄入一行數(shù)據(jù)時(shí)敲一下回車?yán)^續(xù)下一行數(shù)據(jù)的錄入。能不能眷顧一下這些老用戶的習(xí)慣也是我們開發(fā)人員應(yīng)該考慮的事情。
筆者在前不久的一個(gè)項(xiàng)目中就遇到了這樣的問題:用戶要求我們的前臺(tái)錄入頁面提供支持回車換行的功能。做過開發(fā)的人都知道在傳統(tǒng)windows應(yīng)用程序中實(shí)現(xiàn)回車換行其實(shí)并不太難,我們可以通過截獲鍵盤的回車按鍵值,然后通過發(fā)送消息使錄入界面中的下一控件(如:文本框輸入框等)獲得輸入焦點(diǎn)來達(dá)到這個(gè)目的。在web頁面中我們也可以通過腳本(javascript或vbscript)語言設(shè)置web控件的焦點(diǎn)來實(shí)現(xiàn)。
在傳統(tǒng)的asp或jsp/php中編寫的web應(yīng)用程序中實(shí)現(xiàn)回車換行的功能時(shí),我們通常的做法就是在控件的onkeypress事件、onclick事件或頁面中的onsubmit等事件中寫上一段javascript或vbscript代碼捕捉到鍵盤回車的鍵值,然后人為指定跳轉(zhuǎn)順序?qū)崿F(xiàn)回車換行,這種做法缺點(diǎn)只能適用于頁面控件元素很少項(xiàng)目不大的場合,一旦頁面控件元素或該類文件很多時(shí),這種人工方式必然要消耗很大的工作量。能不能有一個(gè)行之有效的辦法使我們一勞永逸?這就是本文筆者要討論的內(nèi)容。諸位看官莫急,容我慢慢道來:
我們的項(xiàng)目是用vb.net開發(fā)的,前臺(tái)錄入界面是vb.net程序編譯后生成的html頁面,在瀏覽器中運(yùn)行。vb.net開發(fā)的程序最大的好處是程序代碼可以和界面相隔離,也就是相互獨(dú)立;但是用vb.net開發(fā)的程序編譯后生成的html錄入界面中的控件元素名稱是很難確定的,雖然也會(huì)具有一定的命名規(guī)則。在編譯前我們是無法得知編譯生成頁面上的可錄入控件元素名稱的。
這樣一來我們就碰到了一個(gè)問題,難道說我們要實(shí)現(xiàn)dos下的回車換行功能就只有打開一個(gè)個(gè)的aspx文件查看其中的元素名稱,然后按asp或jsp/php中的做法寫相應(yīng)的javascript或vbscript代碼了嗎?這顯然是一個(gè)讓人暈倒的事實(shí);我們的這個(gè)項(xiàng)目有上百個(gè)aspx文件,要打開上百個(gè)文件一一按asp或jsp/php中的做法寫下javascript或vbscript回車實(shí)現(xiàn)代碼簡直就是奇聞。筆者通過查msdn和反復(fù)實(shí)踐找到了解決方法。
下面我將用javascript腳本語言為例來解決這個(gè)問題,在寫代碼前我得向大家介紹一些相關(guān)知識(shí);瀏覽器中瀏覽的頁面文件在javascript中稱之為一個(gè)文檔對(duì)象(dom)。在 javascript 能夠涉及的范圍內(nèi)有如下幾個(gè)“大”對(duì)象:window, document, location, navigator, screen, history 等。window對(duì)象是document、location和history對(duì)象的父對(duì)象。
圍繞我們要解決的問題,這里我們重點(diǎn)提一下document、form、elements三個(gè)對(duì)象及onkeypress事件,document 文檔對(duì)象:是指描述當(dāng)前窗口或指定窗口對(duì)象的文檔。它包含了文檔從<head>到</body>的內(nèi)容。用法:document (當(dāng)前窗口)或 <窗口對(duì)象>.document (指定窗口) ; form 對(duì)象:document.forms[] 是一個(gè)數(shù)組,包含了文檔中所有的表單form ;elements對(duì)象:為表單元素對(duì)象,<表單對(duì)象>.elements 是一個(gè)數(shù)組,包含了該表單所有的對(duì)象;onkeypress事件是一個(gè)鍵盤事件,是在用戶按下鍵盤上的鍵時(shí)引發(fā)的事件。通過這三大對(duì)象再配合onkeypress事件就可以完成現(xiàn)我們的要求;
下面是最終的實(shí)現(xiàn)代碼清單:
var jumptypearray =new array("text","password","textarea","checkbox","radio",
"select","select-one","select-multiple","file")//引用頁面上可獲得焦點(diǎn)元素類型
var debartypearray =new array("submit","reset","button","checkbox","radio",
"select","select-one","select-multiple","hidden")//引用頁面上需排除元素類型
function instrarray(src,dec)
{//檢查給定串是否在指定字符串?dāng)?shù)組中,如在返回索引號(hào),否返回-1;
for (var i=0 ; i<dec.length; i++)
{
if (src==dec[i])
{
return i;//定位成功,返回索引號(hào)
break;
}
}
return -1; //定位失敗,返回-1
}
function checkcr(evt)
{//回車響應(yīng)函數(shù)
var evt = (evt) ? evt : ((event) ? event : null);
var node = (evt.target) ? evt.target : ((evt.srcelement) ? evt.srcelement : null);
var frm=document.forms[0]; //指定form名稱為頁面中的第一個(gè)
if ((evt.keycode == 13) && (instrarray(node.type,jumptypearray)!=-1))
{//判斷當(dāng)前對(duì)象是否為可輸入對(duì)象,對(duì)象類型數(shù)組:jumptypearray
for (var i = 0 ; i < frm.elements.length; i++)
{//for begin
if (frm.elements[i].name==node.name)
{//定位當(dāng)前對(duì)象
if ((i+1)< frm.elements.length)
{//對(duì)象數(shù)組索引越位判斷
if (instrarray(frm.elements[i+1].type,jumptypearray)!=-1)
{ //判斷當(dāng)前對(duì)象下一個(gè)對(duì)象是否為可輸入組件,對(duì)象類型數(shù)組:jumptypearray
frm.elements[i+1].focus();//設(shè)置焦點(diǎn)
if (instrarray(frm.elements[i+1].type,debartypearray)==-1)
{ //過濾不可選中文本對(duì)象,對(duì)象類型數(shù)組:debartypearray
frm.elements[i+1].select();//選中組件文本內(nèi)容
}
}
return false;//禁止提交表單內(nèi)容
break;
}
else
{//提交表單內(nèi)容
return true;
break;
}
}
}//end for
}
}
document.onkeypress = checkcr;
引用說明:將上面的代碼存成文件,如:webenter.js,然后在要實(shí)現(xiàn)回車換行的頁面中寫上:
<script language="javascript" src="path+webenter.js"></script> 即可。
path:是webenter.js文件所在路徑。
適用環(huán)境:windows9x/nt/2000/xp+asp/jsp/php/asp.net+ie4.x(及以上版本)
注意事項(xiàng):
1、引用頁面中不能有多個(gè)表單(form)。
2、引用頁面中不允許有重名對(duì)象(object)。
調(diào)用例子:http://dbs.myrice.com/dbs/demo.html
最后需要說明的是:當(dāng)引用頁面在ns系列瀏覽器中瀏覽時(shí),以上代碼需修改,因?yàn)樵趎s中的瀏覽器對(duì)象和ie中的對(duì)象是有一點(diǎn)區(qū)別的,這個(gè)就留給讀者練手了。
,歡迎訪問網(wǎng)頁設(shè)計(jì)愛好者web開發(fā)。