用Javascript陣列做個查詢工具 - 2009.4.2

前幾天想做個普通話量詞與名詞搭配查詢工具,於是在網上找程序碼,找到一段Javascript陣列的教學示範,把它改做查詢工具,結構很簡單,一看就懂,程式碼如下:[量詞名詞搭配表範例檔]

<HTML> 
<HEAD>
<SCRIPT LANGUAGE="JavaScript">

//=====================
// Javascript 陣列示範程式
// Edit by KY
// 2009.4
//=====================

var Ming = new Array(4)                    
// 定義名詞陣列,從0開始
Ming[0] = "手錶"
Ming[1] = "蘑菇"
Ming[2] = "電池"
Ming[3] = "寶劍"
Ming[4] = "鑰匙"

var Liang = new Array(4)                    
// 定義量詞陣列,從0開始
Liang [0] = "塊/隻"
Liang [1] = "朵"
Liang [2] = "節"
Liang [3] = "口/把"
Liang [4] = "把"

function getLiang() {

var selectedMing = document.entryForm.entry.value      
// 對輸入的變量賦值
for ( var i = 0; i < Ming.length; i++) {                              
// 從0開始到結尾檢查名詞陣列
if (Ming[i] == selectedMing) {                                         
// 如果結果與輸入相同
alert("一"+ Liang[i]+selectedMing);                                 
// 跳出視窗顯示答案
break }

if (i == Ming.length - 1)                                                
// 如果檢查至結尾無相符者
{alert ("您輸入的詞語不在本表範圍內") }               
// 跳出錯誤提示視窗
}}

function checkkey()                                
// 定義檢查鍵盤

if (event.keyCode==13)                          
// 若Enter被按下
getLiang();                                              
// 獲取輸入的詞語


</SCRIPT>
</HEAD>
<BODY onkeydown="checkkey()">
<FORM NAME="entryForm">
請輸入名詞: 
<INPUT TYPE="text" NAME="entry" size="8">
<INPUT TYPE="button" VALUE="查看" onClick="getLiang()"> 
</BODY>
</HTML> 

如果希望程序簡潔些,另外也可避免程序碼輕易被盜,可以把Javascript部分(棕色)獨立存成名為.js的文字檔,然後在html中調用。調用方式如下:

<HTML> 
<HEAD>
<SCRIPT LANGUAGE="JavaScript" src="檔案名.js"></SCRIPT>
</HEAD>

另外,資料庫可以Excel建立,用Excel可以輕易加入Javascript所需的符號,免除繁瑣的人手輸入及減少出錯的機會。範例如下:

量詞 名詞
Liang [ 1 ] = " " Ming [ 1 ] = " 菜刀 "
Liang [ 2 ] = " " Ming [ 2 ] = " 剪刀 "
Liang [ 3 ] = " / " Ming [ 3 ] = " 寶劍 "
Liang [ 4 ] = " " Ming [ 4 ] = " 鏟子 "

在Word中導入Excel產生的程式碼,表格轉文字,再尋找取代空格,即完成了所需要的資料陣列。

另外,用選單組合配合Javascript可做出另一種查詢表,可參看我做的親屬關係查詢工具

* 可以 document.write 代替 alert 輸出結果,結果會顯示在當前頁面。
* 如果不定義錯誤處理程序,當輸入沒有的詞語時會顯示"undefined"訊息,感謝姚同學協助提供程式碼。
* 如有問題可上百度知道提問,效率非常高,說不定當天就可找到滿意的答案。那段鍵盤偵測碼就是熱心網友提供的。

 

KY'sHome | 攝影相關 | 電腦相關 | 我的相簿 | 其他類別