データベーススクリプトVer6です。
これは簡易検索機能タイプのデータベースです。
何でも良いので、データに含まれている文字を入力すると、
その文字に関するデータが出力されます。
データ出力する項目を選択する事も出来ます。
例えば入力したキーワードに一致する2つの項目だけを結果として表示する、
と言う形です。
デフォルトでは全ての項目にチェックが入っています。
キーワード検索の場合、半角スペースで区切る事で、複数検索も可能です。
ただし複数検索の場合、or検索のみで、and検索は不可能です。
現在入ってるサンプルデータはギリシア神話、オリンポス神族に関するものです。
ちなみに諸説あるものも、あえて一つの説しかあげてません。
ゼウス・主神・ヘラ・レア・クロノス
ヘラ・女神の女王・ゼウス・レア・クロノス
デメテル・農業、大地・ゼウス・レア・クロノス
ポセイドン・海神・レア・クロノス
プルートーン・冥界神・レア・クロノス
ヘスティア・かまどの神・レア・クロノス
ヘーパイストス・鍛冶・アプロディーテ・ヘラ・ゼウス
アレス・戦い・レア・ゼウス
アポロン・太陽、音楽、医術、予言・レト・ゼウス
アルテミス・月、狩猟、出産・レト・ゼウス
アテナ・戦い、知識、技芸・メティス・ゼウス
アプロディーテ・愛、美・ディオーネー・ゼウス
ヘルメス・伝令、商売、競技、熟練、機敏・マイア・ゼウス
全データに「第三世代・オリンポス」のデータも入ってます。
・サンプルを見る
・ソースを保存する (右クリック→「対象をファイルに保存」or「リンクを名前を付けて保存」して下さい。)
・ソースを見る ・解説を見る
・補足解説を見る
[ ソース ]
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<script language="JavaScript">
<!--//Copyright (C) WEST MiRa http://www.west-mira.jp
my_data=new Array();
ths=new Array();
td_align=new Array();
//********** データ *********
//項目名
ths[0]="世代名";
ths[1]="神族名"
ths[2]="名 前";
ths[3]="説 明";
ths[4]="伴 侶";
ths[5]="母 親";
ths[6]="父 親";
//データの総数
//データの増減を行った際は、必ず書き替えて下さい。
data_num=13;
for(i=0; i<data_num; i++){ my_data[i]=new Array(); }
//データ1
my_data[0][0]="第三世代";
my_data[0][1]="オリンポス";
my_data[0][2]="ゼウス";
my_data[0][3]="主神";
my_data[0][4]="ヘラ";
my_data[0][5]="レア";
my_data[0][6]="クロノス";
//データ2
my_data[1][0]="第三世代";
my_data[1][1]="オリンポス";
my_data[1][2]="ヘラ";
my_data[1][3]="女神の女王";
my_data[1][4]="ゼウス";
my_data[1][5]="レア";
my_data[1][6]="クロノス";
//データ3
my_data[2][0]="第三世代";
my_data[2][1]="オリンポス";
my_data[2][2]="デメテル";
my_data[2][3]="農業、大地";
my_data[2][4]="ゼウス";
my_data[2][5]="レア";
my_data[2][6]="クロノス";
//データ4
my_data[3][0]="第三世代";
my_data[3][1]="オリンポス";
my_data[3][2]="ポセイドン";
my_data[3][3]="海神";
my_data[3][4]="<br>";
my_data[3][5]="レア";
my_data[3][6]="クロノス";
//データ5
my_data[4][0]="第三世代";
my_data[4][1]="オリンポス";
my_data[4][2]="プルートーン";
my_data[4][3]="冥界神";
my_data[4][4]="<br>";
my_data[4][5]="レア";
my_data[4][6]="クロノス";
//データ6
my_data[5][0]="第三世代";
my_data[5][1]="オリンポス";
my_data[5][2]="ヘスティア";
my_data[5][3]="かまどの神";
my_data[5][4]="<br>";
my_data[5][5]="レア";
my_data[5][6]="クロノス";
//データ7
my_data[6][0]="第三世代";
my_data[6][1]="オリンポス";
my_data[6][2]="ヘーパイストス";
my_data[6][3]="鍛冶";
my_data[6][4]="アフロディーテ";
my_data[6][5]="ヘラ";
my_data[6][6]="ゼウス";
//データ8
my_data[7][0]="第三世代";
my_data[7][1]="オリンポス";
my_data[7][2]="アレス";
my_data[7][3]="戦い";
my_data[7][4]="<br>";
my_data[7][5]="レア";
my_data[7][6]="ゼウス";
//データ9
my_data[8][0]="第三世代";
my_data[8][1]="オリンポス";
my_data[8][2]="アポロン";
my_data[8][3]="太陽、音楽、医術、予言";
my_data[8][4]="<br>";
my_data[8][5]="レト";
my_data[8][6]="ゼウス";
//データ10
my_data[9][0]="第三世代";
my_data[9][1]="オリンポス";
my_data[9][2]="アルテミス";
my_data[9][3]="月、狩猟、出産";
my_data[9][4]="<br>";
my_data[9][5]="レト";
my_data[9][6]="ゼウス";
//データ11
my_data[10][0]="第三世代";
my_data[10][1]="オリンポス";
my_data[10][2]="アテナ";
my_data[10][3]="戦い、知識、技芸";
my_data[10][4]="<br>";
my_data[10][5]="メティス";
my_data[10][6]="ゼウス";
//データ12
my_data[11][0]="第三世代";
my_data[11][1]="オリンポス";
my_data[11][2]="アプロディーテ";
my_data[11][3]="愛、美";
my_data[11][4]="<br>";
my_data[11][5]="ディオーネー";
my_data[11][6]="ゼウス";
//データ13
my_data[12][0]="第三世代";
my_data[12][1]="オリンポス";
my_data[12][2]="ヘルメス";
my_data[12][3]="伝令、商売、競技、熟練、機敏";
my_data[12][4]="<br>";
my_data[12][5]="マイア";
my_data[12][6]="ゼウス";
//********** 配置指定 *********
//center , right , leftのいずれかを指定
//結果画面全体の配置
table_align="left";
//項目の配置
th_align="center";
//データの配置
//上から順に項目1の配置、項目2の配置…
td_align[0]="left";
td_align[1]="left";
td_align[2]="left";
td_align[3]="left";
td_align[4]="left";
td_align[5]="left";
td_align[6]="left";
//********** スタイル *********
//ウィンドウのタイトルを指定
win_title='結果画面';
//ウィンドウの背景色を指定
bg_color='#ffffff';
//ウィンドウの文字色を指定
text_color='#000000';
//ウィンドウのリンク色を指定
link_color='#ff0000';
//ウィンドウのvlink色を指定
vlink_color='#00ff00';
//ウィンドウのalink色を指定
alink_color='#0000ff';
//テーブルの横幅を指定
table_w='400';
//テーブルの背景色を指定
table_bgcolor='#ffffff';
//テーブルのthの背景色を指定
th_bgcolor='#ffd9b7';
//テーブルのthの文字色を指定
th_textcolor='#622f00';
//テーブルのthの文字サイズを指定
th_textsize='3';
//テーブルのtdの背景色を指定
td_bgcolor='#fff795';
//テーブルのtdの文字色を指定
td_textcolor='#645c00';
//テーブルのtdの文字サイズを指定
td_textsize='3';
//ウィンドウの戻るボタン名を指定
//画像ボタンを使用したい場合は、imgタグを記入
button='戻る';
function syuukei()
{
var mojis='';
kensaku=new Array();
kensaku=document.form1.text1.value.split(" ");
my_form=new Array();
for(i=1; i<ths.length+1; i++)my_form[i-1]=document.form1.elements[i].checked;
mojis='<html>\n<head>\n<title>'+win_title+'<\/title>\n<\/head>\n';
mojis+='<body text="'+text_color+'" bgcolor="'+bg_color+'" link="'+link_color+'" vlink="'+vlink_color+'" alink="'+alink_color+'">\n';
mojis+='「'+kensaku+'」の検索結果<br>\n';
mojis+='<div align="'+table_align+'">';
mojis+='<table width="'+table_w+'" border="1" bgcolor="'+table_bgcolor+'">\n';
mojis+='<tr align="'+th_align+'">\n';
for(i=0; i<ths.length; i++)
if(my_form[i] == true)
mojis+='<th bgcolor="'+th_bgcolor+'"><font size="'+th_textsize+'" color="'+th_textcolor+'">'+ths[i]+'<\/font><\/th>\n';
mojis+='<\/tr>\n';
for(i=0; i<my_data.length; i++)
{
for(j=0;j<ths.length;j++)
{
for(l=0; l<kensaku.length; l++)
{
if(my_data[i][j].indexOf(kensaku[l]) != -1)
{
mojis+='<tr>\n';
for(k=0; k<ths.length; k++)
{
if(my_form[k] == true)
mojis+='<td bgcolor="'+td_bgcolor+'" align="'+td_align[k]+'"><font size="'+td_textsize+'" color="'+td_textcolor+'">'+my_data[i][k]+'<\/font><\/td>\n';
}
}
}
}
mojis+='<\/tr>\n';
}
mojis+='<\/table>\n<br clear="all"><a href="javascript:history.back();">'+button+'<\/a><\/font><\/div><\/body><\/html>';
delete kensaku;
delete my_form;
with(document)
{
open();
write(mojis);
close();
}
}
//-->
</script>
</head>
<body>
<form name="form1" onSubmit="syuukei();">
<input type="text" size="25" name="text1"><br>
<input type="checkbox" name="dai" checked>世代名
<input type="checkbox" name="dainame" checked>神族名
<input type="checkbox" name="name" checked>名前<br>
<input type="checkbox" name="syoutyou" checked>説明
<input type="checkbox" name="hanryo" checked>伴侶
<input type="checkbox" name="haha" checked>母親
<input type="checkbox" name="titi" checked>父親<br>
<input type="button" value="Click!" onClick="syuukei();">
</form>
・
・
・
</body></html>
[ 解説 ]
まず最初にデータの形式から説明していきます。
//データ1
my_data[0][0]="第三世代";
my_data[0][1]="オリンポス";
my_data[0][2]="ゼウス";
my_data[0][3]="主神";
my_data[0][4]="ヘラ";
my_data[0][5]="レア";
my_data[0][6]="クロノス";
で、一つのデータです。
データを増やす場合、減らす場合、上の6行を丸々増やすor減らす事になります。
サンプルにデータを一つ増やすとすると、
変 更 前 | 変 更 後 |
//データ1
my_data[0][0]="第三世代";
my_data[0][1]="オリンポス";
my_data[0][2]="ゼウス";
my_data[0][3]="主神";
my_data[0][4]="ヘラ";
my_data[0][5]="レア";
my_data[0][6]="クロノス";
//データ2
my_data[1][0]="第三世代";
my_data[1][1]="オリンポス";
my_data[1][2]="ヘラ";
my_data[1][3]="女神の女王";
my_data[1][4]="ゼウス";
my_data[1][5]="レア";
my_data[1][6]="クロノス";
……
//データ12
my_data[11][0]="第三世代";
my_data[11][1]="オリンポス";
my_data[11][2]="アプロディーテ";
my_data[11][3]="愛、美";
my_data[11][4]="<br>";
my_data[11][5]="ディオーネー";
my_data[11][6]="ゼウス";
//データ13
my_data[12][0]="第三世代";
my_data[12][1]="オリンポス";
my_data[12][2]="ヘルメス";
my_data[12][3]="伝令、商売、競技、熟練、機敏";
my_data[12][4]="<br>";
my_data[12][5]="マイア";
my_data[12][6]="ゼウス";
|
//データ1
my_data[0][0]="第三世代";
my_data[0][1]="オリンポス";
my_data[0][2]="ゼウス";
my_data[0][3]="主神";
my_data[0][4]="ヘラ";
my_data[0][5]="レア";
my_data[0][6]="クロノス";
//データ2
my_data[1][0]="第三世代";
my_data[1][1]="オリンポス";
my_data[1][2]="ヘラ";
my_data[1][3]="女神の女王";
my_data[1][4]="ゼウス";
my_data[1][5]="レア";
my_data[1][6]="クロノス";
……
//データ12
my_data[11][0]="第三世代";
my_data[11][1]="オリンポス";
my_data[11][2]="アプロディーテ";
my_data[11][3]="愛、美";
my_data[11][4]="<br>";
my_data[11][5]="ディオーネー";
my_data[11][6]="ゼウス";
//データ13
my_data[12][0]="第三世代";
my_data[12][1]="オリンポス";
my_data[12][2]="ヘルメス";
my_data[12][3]="伝令、商売、競技、熟練、機敏";
my_data[12][4]="<br>";
my_data[12][5]="マイア";
my_data[12][6]="ゼウス";
//データ14
my_data[13][0]="第三世代";
my_data[13][1]="オリンポス";
my_data[13][2]="ヘルメス";
my_data[13][3]="伝令、商売、競技、熟練、機敏";
my_data[13][4]="<br>";
my_data[13][5]="マイア";
my_data[13][6]="ゼウス";
|
このように、書式が同じで、赤字の数字部分が一つずつ大きくなっていきます。
データの内容がない部分には、「<br>」を入れて下さい。
上では2行目と、6行目に入ってますね。
入れなくても別に問題はないのですが、結果を綺麗に見せるため、
入れた方が良いでしょう。
データを削除する際は、下から順に1つのデータを丸ごと削除します。
例えばサンプルのデータからデータを1つ削除するとしますと、以下のようになります。
変 更 前 | 変 更 後 |
//データ1
my_data[0][0]="第三世代";
my_data[0][1]="オリンポス";
my_data[0][2]="ゼウス";
my_data[0][3]="主神";
my_data[0][4]="ヘラ";
my_data[0][5]="レア";
my_data[0][6]="クロノス";
//データ2
my_data[1][0]="第三世代";
my_data[1][1]="オリンポス";
my_data[1][2]="ヘラ";
my_data[1][3]="女神の女王";
my_data[1][4]="ゼウス";
my_data[1][5]="レア";
my_data[1][6]="クロノス";
……
//データ12
my_data[11][0]="第三世代";
my_data[11][1]="オリンポス";
my_data[11][2]="アプロディーテ";
my_data[11][3]="愛、美";
my_data[11][4]="<br>";
my_data[11][5]="ディオーネー";
my_data[11][6]="ゼウス";
//データ13
my_data[12][0]="第三世代";
my_data[12][1]="オリンポス";
my_data[12][2]="ヘルメス";
my_data[12][3]="伝令、商売、競技、熟練、機敏";
my_data[12][4]="<br>";
my_data[12][5]="マイア";
my_data[12][6]="ゼウス";
|
//データ1
my_data[0][0]="第三世代";
my_data[0][1]="オリンポス";
my_data[0][2]="ゼウス";
my_data[0][3]="主神";
my_data[0][4]="ヘラ";
my_data[0][5]="レア";
my_data[0][6]="クロノス";
//データ2
my_data[1][0]="第三世代";
my_data[1][1]="オリンポス";
my_data[1][2]="ヘラ";
my_data[1][3]="女神の女王";
my_data[1][4]="ゼウス";
my_data[1][5]="レア";
my_data[1][6]="クロノス";
……
//データ12
my_data[11][0]="第三世代";
my_data[11][1]="オリンポス";
my_data[11][2]="アプロディーテ";
my_data[11][3]="愛、美";
my_data[11][4]="<br>";
my_data[11][5]="ディオーネー";
my_data[11][6]="ゼウス";
|
項目の名称(名前、住所など)を変更したい場合は、
ths[0]="世代名";
ths[1]="神族名";
ths[2]="名 前";
ths[3]="説 明";
ths[4]="伴 侶";
ths[5]="母 親";
ths[6]="父 親";
の部分を変更します。お好きな項目の名称を入れて下さい。
また、スクリプトの下の方にある
<input type="checkbox" name="dai">世代名
<input type="checkbox" name="dainame">神族名
<input type="checkbox" name="name">名前<br>
<input type="checkbox" name="syoutyou">説明
<input type="checkbox" name="hanryo">伴侶
<input type="checkbox" name="haha">母親
<input type="checkbox" name="titi">父親<br>
部分も、同じの名称に変更して下さい。
項目自体を減ら場合は、不要な項目を削除します。
その際、スクリプト内の項目名称部分、HTML部分のインプットタグ、
データ部分の、3つの部分で不要な項目を削除して下さい。
例えば、サンプルで「父親」の項目を削除する場合。
まず各データの「父親」の項目に当たるデータを削除します。
変 更 前 | 変 更 後 |
//データ1
my_data[0][0]="第三世代";
my_data[0][1]="オリンポス";
my_data[0][2]="ゼウス";
my_data[0][3]="主神";
my_data[0][4]="ヘラ";
my_data[0][5]="レア";
my_data[0][6]="クロノス";
//データ2
my_data[1][0]="第三世代";
my_data[1][1]="オリンポス";
my_data[1][2]="ヘラ";
my_data[1][3]="女神の女王";
my_data[1][4]="ゼウス";
my_data[1][5]="レア";
my_data[1][6]="クロノス";
……
//データ12
my_data[11][0]="第三世代";
my_data[11][1]="オリンポス";
my_data[11][2]="アプロディーテ";
my_data[11][3]="愛、美";
my_data[11][4]="<br>";
my_data[11][5]="ディオーネー";
my_data[11][6]="ゼウス";
//データ13
my_data[12][0]="第三世代";
my_data[12][1]="オリンポス";
my_data[12][2]="ヘルメス";
my_data[12][3]="伝令、商売、競技、熟練、機敏";
my_data[12][4]="<br>";
my_data[12][5]="マイア";
my_data[12][6]="ゼウス";
|
//データ1
my_data[0][0]="第三世代";
my_data[0][1]="オリンポス";
my_data[0][2]="ゼウス";
my_data[0][3]="主神";
my_data[0][4]="ヘラ";
my_data[0][5]="レア";
//データ2
my_data[1][0]="第三世代";
my_data[1][1]="オリンポス";
my_data[1][2]="ヘラ";
my_data[1][3]="女神の女王";
my_data[1][4]="ゼウス";
my_data[1][5]="レア";
……
//データ12
my_data[11][0]="第三世代";
my_data[11][1]="オリンポス";
my_data[11][2]="アプロディーテ";
my_data[11][3]="愛、美";
my_data[11][4]="<br>";
my_data[11][5]="ディオーネー";
//データ13
my_data[12][0]="第三世代";
my_data[12][1]="オリンポス";
my_data[12][2]="ヘルメス";
my_data[12][3]="伝令、商売、競技、熟練、機敏";
my_data[12][4]="<br>";
my_data[12][5]="マイア";
|
次に、スクリプト内の項目名の名称を削除します。
変 更 前 | 変 更 後 |
ths[0]="世代名";
ths[1]="神族名"
ths[2]="名 前";
ths[3]="説 明";
ths[4]="伴 侶";
ths[5]="母 親";
ths[6]="父 親";
|
ths[0]="世代名";
ths[1]="神族名"
ths[2]="名 前";
ths[3]="説 明";
ths[4]="伴 侶";
ths[5]="母 親";
|
最後に、HTML部分のインプットタグを削除します。
変 更 前 | 変 更 後 |
<input type="checkbox" name="dai">世代名
<input type="checkbox" name="dainame">神族名
<input type="checkbox" name="name">名前<br>
<input type="checkbox" name="syoutyou">説明
<input type="checkbox" name="hanryo">伴侶
<input type="checkbox" name="haha">母親
<input type="checkbox" name="titi">父親<br>
|
<input type="checkbox" name="dai">世代名
<input type="checkbox" name="dainame">神族名
<input type="checkbox" name="name">名前<br>
<input type="checkbox" name="syoutyou">説明
<input type="checkbox" name="hanryo">伴侶
<input type="checkbox" name="haha">母親
|
これで、1つの項目を完全に削除できました。
ちなみに、増やす時はこれと反対の要領で、3つの部分の項目を増やしていけばOKです。
項目を増やす際、数字の部分を1つずつ繰り上げていくのを忘れないでください。
(補足)
このスクリプトをフレームで使用し、結果画面を別フレームに表示したい場合はスクリプト内にある
with(document){
を
with(parent.フレーム名.document){
に直してください。
|