全国版住所検索システムを作る その４くらいか？
元のデータから、整形して、MySQLに登録するまでを、一つのwebアプリでやってしまうように
作ってみた。
http://www.kitagawa.tv/zipjis/ZIPJIS9B.lzh
の中身のデータを、テキストエリアにペーストして、変換する
（その時間は不明。マシンによって差があるかも。俺の２０分？わすれた。）
あとは、適当にデータベースにアクセスして、データを登録する(こっちは数時間)
この説明だけで、動かせるられる人なんていないだろうな？
もしいるなら、こんなふうには、作らないよな？！
だから、「ゴミ箱」だ〜ね。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html lang="ja"> <head> <meta http-equiv="Content-type" content="text/html; charset=UTF-8"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <meta http-equiv="Content-Style-Type" content="text/css"> <title>日本郵便辞書データ変換＆MySQL登録用webアプリ</title> <style type="text/css"> body { background-color:#888 } textarea { width:100%; } #result { border: 2px inset; margin: 1em; padding: 1ex; white-space: pre; } </style> </head> <body> <form action="#" name="ConvertForm"> <p> 変換するテキスト <input type="button" value="変換実行" id="btn21"><br> <textarea cols="80" rows="30" name="" id="t1"></textarea> </p> <hr> <ol> <li> <input type="button" value="接続確認" id="btn0"> </li> <li><input type="button" value="データベースの表示" id="btn1"></li> <li> データベース名：<input type="text" value="myData" id="db_name"> <input type="button" value="新規作成" id="btn2"> <input type="button" value="削除する" id="btn4"> </li> <li><input type="button" value="テーブルの一覧" id="btn5"></li> <li> テーブル名：<input type="text" value="japan_zip" id="tb_name"> <input type="button" value="新規作成" id="btn6"> <input type="button" value="構造を見る" id="btn7"> <input type="button" value="表を部分表示(10件)" id="btn8"> <input type="button" value="削除する" id="btn9"> </li> <li> <input type="button" value="登録する" id="btn10"> </li> </ol> <hr> <textarea id="result" cols="80" rows="25">実行した結果が表示されます。</textarea><br> Counter : <input type="text" id="counter">登録件数<br> </form> <script type="text/javascript"><!-- //@cc_on //クリックイベント処理 document./*@if( @_jscript ) attachEvent( 'on' + @else@*/ addEventListener( /*@end@*/ 'click', (function ( $V ) { return function ( evt ) { var e = evt./*@if( @_jscript ) srcElement @else@*/ target /*@end@*/; switch( e.id ) { case 'btn0': // 接続確認 connect(); break; case 'btn1': // 登録されているデータベースの一覧 connect( 'SHOW DATABASES' ); break; case 'btn2': // 新規にデータベースを作成 connect( 'CREATE DATABASE ' + $V('db_name') + ' CHARACTER SET utf8' ); break; case 'btn4': // データベースを削除 connect( 'DROP DATABASE ' + $V('db_name') ); break; case 'btn5': // 指定のデータベースのテーブルの一覧表示 connect( 'USE ' + $V('db_name') + '; \x1f SHOW TABLES' ); break; case 'btn6': // 新規テーブルの作成 connect( 'CREATE TABLE ' + $V('db_name') + '.' + $V('tb_name') + ' (' + 'ID INT(30) UNSIGNED NOT NULL AUTO_INCREMENT, ' + 'ZIP_CODE VARCHAR(30) DEFAULT NULL, ' + 'ADDRESS1 VARCHAR(240) DEFAULT NULL, ' + 'ADDRESS2 VARCHAR(240) DEFAULT NULL, ' + 'TEL VARCHAR(36) DEFAULT NULL, ' + 'ROMAN TINYTEXT DEFAULT NULL, ' + 'PRIMARY KEY (ID) ' + ') ENGINE = MyISAM DEFAULT CHARSET = utf8' ); break; case 'btn7': // テーブルの作成時の構造を表示 connect( 'SHOW CREATE TABLE ' + $V('db_name') + '.' + $V('tb_name') ); break; case 'btn8': // テーブルの登録内容を10件だけ表示 connect( 'SELECT * FROM ' + $V('db_name') + '.' + $V('tb_name') + ' LIMIT 10'); break; case 'btn9': // テーブルを削除する connect( 'DROP TABLE ' + $V('db_name') + '.' + $V('tb_name') ); break; case 'btn10': // 登録 regist(); break; case 'btn21': //変換 convert(); break; default: } }; })( function ( id ) { return document.getElementById( id ).value; }) , false ); //___________________________ //テキストエリアのデータを、整形する // var convert = (function ( ) { var reg = /(（.+?）)|(\(.+?\))|(")|(他に掲載がない場合)|(ﾀﾆｹｲｻｲｶﾞﾅｲﾊﾞｱｲ)/g; var cut = /\r\n|\n|\r/g; var fmt = /^(.+?)\t(.+?)\t(.+?)\t(.+?)\t(.+?)\t(.+?)\t(.+?)\t(.+?)\t(.+?)\t(.+?)$/; return function ( ) { var tgt = document.getElementById( 't1' ); var dat = tgt.value.replace( reg, '' ).split( cut ); var val, cnt, o, rec, t; var rst = [ ]; for( cnt = 0; o = dat[ cnt ]; cnt++) { rec = o.split( ',' ); if( rec.length > 1) { t = toRoman(rec[5] + ' ' + rec[6] + ' ' + rec[7] + ' ' + rec[8]); rst.push( rec[0]+'\t'+rec[2]+'\t'+rec[3]+'\t'+rec[9]+'\t'+ t ); } } tgt.value = rst.join( '\n' ); }; })(); //___________________________ //文字列をローマ字表記にする // var toRoman = (function( ) { var roman = { '１':'1', '２':'2', '３':'3', '４':'4', '５':'5', '６':'6', '７':'7', '８':'8', '９':'9', '０':'0', '！':'!', '”':'"', '＃':'#', '＄':'$', '％':'%', '＆':'&', '’':"'", '（':'(', '）':')', '＝':'=', '〜':'~', '｜':'|', '＠':'@', '‘':'`', '＋':'+', '＊':'*', '；':";", '：':':', '＜':'<', '＞':'>', '、':',', '。':'.', '／':'/', '？':'?', '＿':'_', '・':'･', '「':'[', '」':']', '｛':'{', '｝':'}', '￥':'\\', '＾':'^', 'ふぁ':'fa', 'ふぃ':'fi', 'ふぇ':'fe', 'ふぉ':'fo', 'きゃ':'kya', 'きゅ':'kyu', 'きょ':'kyo', 'しゃ':'sha', 'しゅ':'shu', 'しょ':'sho', 'ちゃ':'tya', 'ちゅ':'tyu', 'ちょ':'tyo', 'にゃ':'nya', 'にゅ':'nyu', 'にょ':'nyo', 'ひゃ':'hya', 'ひゅ':'hyu', 'ひょ':'hyo', 'みゃ':'mya', 'みゅ':'myu', 'みょ':'myo', 'りゃ':'rya', 'りゅ':'ryu', 'りょ':'ryo', 'ふゃ':'fya', 'ふゅ':'fyu', 'ふょ':'fyo', 'ぴゃ':'pya', 'ぴゅ':'pyu', 'ぴょ':'pyo', 'びゃ':'bya', 'びゅ':'byu', 'びょ':'byo', 'ぢゃ':'dya', 'ぢゅ':'dyu', 'ぢょ':'dyo', 'じゃ':'ja', 'じゅ':'ju', 'じょ':'jo', 'ぎゃ':'gya', 'ぎゅ':'gyu', 'ぎょ':'gyo', 'ぱ':'pa', 'ぴ':'pi', 'ぷ':'pu', 'ぺ':'pe', 'ぽ':'po', 'ば':'ba', 'び':'bi', 'ぶ':'bu', 'べ':'be', 'ぼ':'bo', 'だ':'da', 'ぢ':'di', 'づ':'du', 'で':'de', 'ど':'do', 'ざ':'za', 'じ':'zi', 'ず':'zu', 'ぜ':'ze', 'ぞ':'zo', 'が':'ga', 'ぎ':'gi', 'ぐ':'gu', 'げ':'ge', 'ご':'go', 'わ':'wa', 'ゐ':'wi', 'う':'wu', 'ゑ':'we', 'を':'wo', 'ら':'ra', 'り':'ri', 'る':'ru', 'れ':'re', 'ろ':'ro', 'や':'ya', 'ゆ':'yu', 'よ':'yo', 'ま':'ma', 'み':'mi', 'む':'mu', 'め':'me', 'も':'mo', 'は':'ha', 'ひ':'hi', 'ふ':'hu', 'へ':'he', 'ほ':'ho', 'な':'na', 'に':'ni', 'ぬ':'nu', 'ね':'ne', 'の':'no', 'た':'ta', 'ち':'ti', 'つ':'tu', 'て':'te', 'と':'to', 'さ':'sa', 'し':'si', 'す':'su', 'せ':'se', 'そ':'so', 'か':'ka', 'き':'ki', 'く':'ku', 'け':'ke', 'こ':'ko', 'あ':'a', 'い':'i', 'う':'u', 'え':'e', 'お':'o', 'ぁ':'la', 'ぃ':'li', 'ぅ':'lu', 'ぇ':'le', 'ぉ':'lo', 'ヶ':'ke', 'ヵ':'ka', 'ん':'n', 'ー':'-', ' ':' ', //___________ 'ﾌｧ':'fa', 'ﾌｨ':'fi', 'ﾌｪ':'fe', 'ﾌｫ':'fo', 'ｷｬ':'kya', 'ｷｭ':'kyu', 'ｷｮ':'kyo', 'ｼｬ':'sha', 'ｼｭ':'shu', 'ｼｮ':'sho', 'ﾁｬ':'tya', 'ﾁｭ':'tyu', 'ﾁｮ':'tyo', 'ﾆｬ':'nya', 'ﾆｭ':'nyu', 'ﾆｮ':'nyo', 'ﾋｬ':'hya', 'ﾋｭ':'hyu', 'ﾋｮ':'hyo', 'ﾐｬ':'mya', 'ﾐｭ':'myu', 'ﾐｮ':'myo', 'ﾘｬ':'rya', 'ﾘｭ':'ryu', 'ﾘｮ':'ryo', 'ﾌｬ':'fya', 'ﾌｭ':'fyu', 'ﾌｮ':'fyo', 'ﾋﾟｬ':'pya', 'ﾋﾟｭ':'pyu', 'ﾋﾟｮ':'pyo', 'ﾋﾞｬ':'bya', 'ﾋﾞｭ':'byu', 'ﾋﾞｮ':'byo', 'ﾁﾞｬ':'dya', 'ﾁﾞｭ':'dyu', 'ﾁﾞｮ':'dyo', 'ｼﾞｬ':'ja', 'ｼﾞｭ':'ju', 'ｼﾞｮ':'jo', 'ｷﾞｬ':'gya', 'ｷﾞｭ':'gyu', 'ｷﾞｮ':'gyo', 'ﾊﾟ':'pa', 'ﾋﾟ':'pi', 'ﾌﾟ':'pu', 'ﾍﾟ':'pe', 'ﾎﾟ':'po', 'ﾊﾞ':'ba', 'ﾋﾞ':'bi', 'ﾌﾞ':'bu', 'ﾍﾞ':'be', 'ﾎﾞ':'bo', 'ﾀﾞ':'da', 'ﾁﾞ':'di', 'ﾂﾞ':'du', 'ﾃﾞ':'de', 'ﾄﾞ':'do', 'ｻﾞ':'za', 'ｼﾞ':'zi', 'ｽﾞ':'zu', 'ｾﾞ':'ze', 'ｿﾞ':'zo', 'ｶﾞ':'ga', 'ｷﾞ':'gi', 'ｸﾞ':'gu', 'ｹﾞ':'ge', 'ｺﾞ':'go', 'ﾜ':'wa', 'ｳｨ':'wi', 'ｳｪ':'we', 'ｦ':'wo', 'ﾗ':'ra', 'ﾘ':'ri', 'ﾙ':'ru', 'ﾚ':'re', 'ﾛ':'ro', 'ﾔ':'ya', 'ﾕ':'yu', 'ﾖ':'yo', 'ﾏ':'ma', 'ﾐ':'mi', 'ﾑ':'mu', 'ﾒ':'me', 'ﾓ':'mo', 'ﾊ':'ha', 'ﾋ':'hi', 'ﾌ':'hu', 'ﾍ':'he', 'ﾎ':'ho', 'ﾅ':'na', 'ﾆ':'ni', 'ﾇ':'nu', 'ﾈ':'ne', 'ﾉ':'no', 'ﾀ':'ta', 'ﾁ':'ti', 'ﾂ':'tu', 'ﾃ':'te', 'ﾄ':'to', 'ｻ':'sa', 'ｼ':'si', 'ｽ':'su', 'ｾ':'se', 'ｿ':'so', 'ｶ':'ka', 'ｷ':'ki', 'ｸ':'ku', 'ｹ':'ke', 'ｺ':'ko', 'ｱ':'a', 'ｲ':'i', 'ｳ':'u', 'ｴ':'e', 'ｵ':'o', 'ｧ':'la', 'ｨ':'li', 'ｩ':'lu', 'ｪ':'le', 'ｫ':'lo', 'ﾝ':'n', 'ｰ':'-', '･':'.', '､':',' }; var reg_tu = /[っｯ]([bcdfghijklmnopqrstuvwyz])/gm; var reg_xtu = /っ|ｯ/gm; return function ( str ) { var pnt = 0; var max = str.length; var s, r; var txt = ''; while( pnt <= max ) { if( r = roman[ str.substring( pnt, pnt + 3 ) ] ) { txt += r; pnt += 3; } else if( r = roman[ str.substring( pnt, pnt + 2 ) ] ) { txt += r; pnt += 2; } else { txt += ( r = roman[ s = str.substring( pnt, pnt + 1 ) ] ) ? r: s; pnt += 1; } } txt = txt.replace( reg_tu, '$1$1' ); txt = txt.replace( reg_xtu, 'xtu' ); return txt; }; })(); var connect = (function ( result ) { return function ( cmnd ) { sendRequest( result, { 'cmnd': cmnd || '' }, 'POST', 'sql.php', true, true ); }; })( function ( o ) { var text = o.responseText; if( /^Erroe/.test( text ) ) return alert('Error'); if( text ) text = text.replace( /\x1e/g, '\n' ).replace( /\x1f/g, ', ' ); document.getElementById( 'result' ).value = text; } ); //MySQLに登録する 経過を表示するため手抜きでグローバル変数にする var data = [ ], counter, timerId = null; var regist = function( ) { if( timerId ) return; counter = 0; data = document.getElementById( 't1' ).value.split( /\r\n|\r|\n/g ); timerId = setInterval( function () { document.getElementById( 'counter' ).value = counter; }, 1000 ); (function ( ) { if( ! data[ counter ] ) { clearInterval( timerId ); timerId = null; return; }; sendRequest( function ( o ) { //登録ミスを記録 var res = o.responseText; if( /^Error/.test( res ) ) document.getElementById( 'result' ).value += data[ counter ] + "\n"; }, { 'cmnd': 'INSERT INTO '+ //挿入SQL document.getElementById('db_name').value + '.' + document.getElementById('tb_name').value + ' ( ZIP_CODE, ADDRESS1, ADDRESS2, TEL, ROMAN ) VALUES ' + ' ( "' + data[ counter ].replace( /\t/g, '","' ) + '")' }, 'POST', 'sql.php', true, true ); ++counter; return setTimeout( arguments.callee, 50 ); // X mm秒後に再呼び出し })(); }; //_Ajax___________ var sendRequest = (function( create, setEncHeader, uriEncode ) { return function (callback, data, method, url, async, sload, user, password) { var oj = create( ); if(! oj) return null; if( sload ) url += ((url.indexOf('?') == -1) ? '?': '&') + 't=' + (new Date).getTime(); var f = 'object' === typeof callback; var callback_onload = f ? callback.onload: callback; var callback_onbeforsetheader = f ? callback.onbeforsetheader: null; /*@if( @_jscript ) oj.onreadystatechange = function () { if( 4 == oj.readyState ) callback_onload( oj ), oj.abort()} @else@*/ oj.onload = function () { callback_onload(oj); oj.abort() } /*@end@*/; data = uriEncode( data, url ); if( 'GET' == method.toUpperCase() ) url += (url.indexOf('?')==-1 ? '?': data=='' ? '': '&') + data; oj.open ( method, url, async, user, password ); if( callback_onbeforsetheader ) callback_onbeforsetheader( oj ); setEncHeader( oj ); oj.send( data ); return oj; }; })( function ( ) { try { return new XMLHttpRequest } catch(e1) { try { return new ActiveXObject( 'Msxml2.XMLHTTP.6.0' ) } catch(e2) { /* try { return new ActiveXObject( 'Msxml2.XMLHTTP.3.0' ) } catch(e3) { */ return null; } } // } }, function ( o ) { if( !window.opera || 'function' === typeof o.setRequestHeader ) o.setRequestHeader( 'Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8' ); return o; }, function ( data, url ) { var d = [ ], i, enc = encodeURIComponent; switch( typeof data ) { case 'object': for( i in data ) d.push( enc(i) + '=' + enc(data[i]) ); break; case 'string': if( '' == data ) return ''; if( data.charAt(0) == '&' ) data = data.substring( 1, data.length ); var datas = data.split( '&' ); for( i = 0; i < datas.length; i++ ) { var dataq = datas[i].split( '=' ); d.push( enc( dataq[0] ) + '=' + enc( dataq[1] ) ); } default: } return d.join( '&' ); } ); //--> </script>
Ajaxのお相手となるPHPのプログラム
パスワードとかは適当に。
<?php define( '_CHAR_CODE', 'UTF-8' ); // 文字コード define( '_RS', chr(30) ); // レコードの区切文字 define( '_US', chr(31) ); // フィールドの区切り文字 define( '_HOST', 'localhost' ); // MySQLの設定を参照 define( '_USER', 'root' ); // MySQLの設定を参照 define( '_PASS', '' ); // MySQLの設定を参照 define( '_REFERER', 'http://' ); //ささやかなURLのチェック mb_language( 'Japanese' ); mb_http_output( _CHAR_CODE ); mb_internal_encoding( _CHAR_CODE ); header ( 'Content-Type: text/html; charset=utf-8' ); ob_start( 'mb_output_handler'); //呼び出し元を確認 $pos = strpos( $_SERVER[ HTTP_REFERER ], _REFERER ); if( false === $pos || 0 < $pos ) exit( 'Error!!'._RS.'Intercepted access.' ); //接続確認 if( !$d = mysql_connect( _HOST, _USER, _PASS ) ) exit( 'Error!!'._RS.' No connect.' ); //SQLコマンドの読み出し $cmnd = $_POST[ 'cmnd' ]; if( !$cmnd ) exit( 'Connected MySQL' ); //SQLが無い場合は接続確認 //複数のSQLを切り分け実行 $sqls = split( _US, $cmnd ); for( $c = 0 ; $sql = $sqls[ $c++ ]; ) if(! $r = mysql_query( $sql, $d ) ) exit( 'Error!! SQLが実行できません。'._RS.$sql._RS.mysql_error( $d ) ); //最後のSQL文の結果だけを返す while( $row = mysql_fetch_array( $r, MYSQL_NUM ) ) $b[ ] = join( _US, $row ); echo $b ? join( _RS, $b ): '';
そして、検索用のWebアプリのHTMLがこれ
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html lang="ja"> <head> <meta http-equiv="Content-type" content="text/html; charset=UTF-8"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <meta http-equiv="Content-Style-Type" content="text/css"> <link rel="stylesheet" type="text/css" href="style.css"> <title>全国住所検索システム</title> </head> <body> <div id="header"> 住所検索（全国版）： <input type="text" size="50" id="key" title="郵便番号や地名の一部を空白で区切って入力します" class="blur"> / 表示 <select id="SearchMax" name="SearchMax" title="一度に表示する行数を指定します"> <option value="5"> 5</option> <option value="10"> 10</option> <option value="15"> 15</option> <option value="20" selected="selected"> 20</option> <option value="30"> 30</option> <option value="50"> 50</option> <option value="100">100</option> <option value="500">500</option> </select>件 </div> <div id="list"> <div id="help"> <h3>利用可能な機能</h3> <dt>郵便番号で検索する</dt> <dd>数値（0〜9）とハイフン（-）で入力すると自動で検索されます</dd> <dt>電話の市外局番で検索する</dt> <dd>"TEL"を入力してから、数値キーで検索が行われます</dd> <dt>住所の名称で検索する</dt> <dd>半角アルファベット文字で入力すると検索が行われます</dd> <dt>データをコピーする</dt> <dd>表示されたデータを、クリックすると自動でクリップボードにコピーされます</dd> </div> </div> <script type="text/javascript" src="./pipi.js"></script> <script type="text/javascript" src="./script.js"></script> </body> </html>
それが呼び出す、Javascript (script.js)
(function ( ) {
var _WAIT_TIME = 350; //mille second
var Page = {
'list': (function ( makeList ) {
var sql_select = "SELECT ID, ZIP_CODE, ADDRESS1, ADDRESS2, TEL FROM myData.japan_zip WHERE ";
var buf;
return function ( str ) {
var e = document.getElementById( 'key' );
var w = (str || e.value).replace( /^\s+|\s+$/g, '' );
var m = document.getElementsByName( 'SearchMax' )[0].value;
var p = document.getElementById( 'list' );
w = w.replace( /^([0-9]{3})([0-9]+)$/, '$1-$2' );
e.value = w;
if( w == buf ) return; else buf = w;
while( p.hasChildNodes( ) ) p.removeChild( p.lastChild );
if( w ) {
if( t = w.match( /^(post(\s+|)|)([0-9\-]+)/i ) ) {
w = " ZIP_CODE LIKE '" + t[3] + "%'";
} else if( t = w.match( /^tel(\s+|)(.*)$/i ) ) {
w = " TEL LIKE '" + t[2] + "%'";
} else {
w = w.replace( /(.+?)(\s+|$)/g, " ROMAN LIKE '%$1%' AND").replace( /AND$/, '');
}
Page.sendSQL( sql_select + w + ' LIMIT ' + m, makeList );
}
};
})(
function ( obj ) {
var dt = obj.responseText;
document.getElementById( 'list' ).innerHTML = dt ? /^Error!/.test( dt ) ?
dt.replace( /\x1f|\x1e/g, '<hr>' ):
'<table border="1"><tr>' + 'ID,郵便番号,住所,住所２,市外局番,'.replace( /(.+?)(,|$)/g, '<th>$1' ) +
dt.replace( /(.+?)(\x1e|$)/g, '\n<tr>$1</tr>').replace( /(<tr>|)(.*?)(\x1f|(<\/tr>))/g, '$1<td>$2</td>$4'):
'No Data.';
}
),
'sendSQL': (function ( ) {
return function ( sql, func ) {
sql && sendRequest( func || function ( ) { ; }, { 'cmnd': sql }, 'POST', 'sql.php', true, true );
};
})()
};
var option = getLocation ( );
var Listener = (function ( getCellsValue, opt ) {
var timerId = null;
var before = null;
var table = {
'@ID': 0, '@ZIPCODE': 1, '@ADDRESS1': 2, '@ADDRESS2': 3,
'@TEL': 4,'@SAGAWA': 5, '@PERIKAN': 6, '@MEITETU': 7
};
return function ( evt ) {
var e = evt./*@if( @_jscript ) srcElement @else@*/ target /*@end@*/;
var t, p, c;
switch( evt.type ) {
case 'keyup':
if( 'key' == e.id ) {
clearTimeout( timerId );
timerId = setTimeout( Page.list, _WAIT_TIME );
}
break;
case 'mouseover':
before && ( before = ( before.className = '', null ) );
if( 'TD' === e.nodeName ) {
before = e.parentNode;
before.className = 'TargetColor';
}
break;
case 'click':
'key' == e.id && e.select();
if( 'TD' === e.nodeName ) {
c = getCellsValue( p = e.parentNode );
t = '〒 ' + c[1] + '\n' + c[2] + ' ' + c[3] + '\n TEL: ' + c[4] + '-';
/*@ clipboardData.setData( 'Text', t); @*/
var w = window.opener, k, e, t, v;
if( w ) {
for( k in opt ) {
if( !/^key$/i.test( k ) && !opt.hasOwnProperty( key ) ) {
e = w.document.getElementsByName( k );
if(! e.length ) e = [ w.document.getElementById( k ) ];
t = table[ opt[k] ];
if( 'number' == typeof t )
for( var i = 0, o; o = e[ i++ ]; )
o.value = c[t];
}
}
window.close();
}
}
break;
default:
}
};})(
function ( tr, n ) {
var node = tr.childNodes, val = [ ], cnt, obj;
for( cnt = 0; obj = node[ cnt++ ]; )
if( /TD|TH/.test( obj.nodeName ) )
val.push( obj./*@if( @_jscript ) innerText @else@*/ textContent /*@end@*/ );
return val;
},
option
);
addEvent( document, 'keyup', Listener );
addEvent( document, 'click', Listener );
addEvent( document, 'mouseover', Listener );
formElementKeeper( 100, 'SearchMax', 'ziportel' );
AutoFocus( document, 'blur focus' );
if( option.key ) Page.list( option.key );
})();
もうひとつ pipi.js
//_汎用関数_(Library)__________________________________________________ //@cc_on function getParent ( node, type, val ) { return node ? ( val == node[type] ) ? node: arguments.callee( node.parentNode, type, val): null; } function addEvent( tgt, evt, eventHandler, flag ) { tgt./*@if(1) attachEvent( 'on' + @else@*/ addEventListener( /*@end@*/ evt, eventHandler, flag ); } function getLocation ( ) { var par = location.search.substring(1).split( '&' ); var cnt, pac, nv, ret = { }; for( cnt = 0; pac = par[ cnt++ ]; ) { nv = pac.split( '=' ); ret[ decodeURIComponent( nv[0] ) ] = decodeURIComponent( nv[1] ); } return ret; } //_Ajax___________ var sendRequest = (function( create, setEncHeader, uriEncode ) { return function (callback, data, method, url, async, sload, user, password) { var oj = create( ); if(! oj) return null; if( sload ) url += ((url.indexOf('?') == -1) ? '?': '&') + 't=' + (new Date).getTime(); var f = 'object' === typeof callback; var callback_onload = f ? callback.onload: callback; var callback_onbeforsetheader = f ? callback.onbeforsetheader: null; /*@if( @_jscript ) oj.onreadystatechange = function () { if( 4 == oj.readyState ) callback_onload( oj ), oj.abort()} @else@*/ oj.onload = function () { callback_onload(oj); oj.abort() } /*@end@*/; data = uriEncode( data, url ); if( 'GET' == method.toUpperCase() ) url += (url.indexOf('?')==-1 ? '?': data=='' ? '': '&') + data; oj.open ( method, url, async, user, password ); if( callback_onbeforsetheader ) callback_onbeforsetheader( oj ); setEncHeader( oj ); oj.send( data ); return oj; }; })( function ( ) { try { return new XMLHttpRequest } catch(e1) { try { return new ActiveXObject( 'Msxml2.XMLHTTP.6.0' ) } catch(e2) { /* try { return new ActiveXObject( 'Msxml2.XMLHTTP.3.0' ) } catch(e3) { */ return null; } } // } }, function ( o ) { if( !window.opera || 'function' === typeof o.setRequestHeader ) o.setRequestHeader( 'Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8' ); return o; }, function ( data, url ) { var d = [ ], i, enc = encodeURIComponent; switch( typeof data ) { case 'object': for( i in data ) d.push( enc(i) + '=' + enc(data[i]) ); break; case 'string': if( '' == data ) return ''; if( data.charAt(0) == '&' ) data = data.substring( 1, data.length ); var datas = data.split( '&' ); for( i = 0; i < datas.length; i++ ) { var dataq = datas[i].split( '=' ); d.push( enc( dataq[0] ) + '=' + enc( dataq[1] ) ); } default: } return d.join( '&' ); } ); var formElementKeeper = (function ( getCookie, setCookie, setValue ) { return function ( day ) { var cnt, cnt2, o, es, e, v; for( cnt = 1; o = arguments[ cnt++ ]; ) { v = getCookie( o ); setValue( o, v ); setCookie( o, v, day ); es = document.getElementsByName( o ); if( 0 == es.length ) es = [ document.getElementById( o ) ]; for( cnt2 = 0; e = es[ cnt2++ ]; ) { e./*@if(1) attachEvent( 'on' + @else@*/ addEventListener( /*@end@*/ 'change', (function( day, set ) { return function ( evt ) { var e = evt./*@if(1) srcElement @else@*/ target /*@end@*/; var nm = e.name || e.id; if( nm ) set( nm, e.value, day); };})( day, setCookie ), true ); } } }; })( function ( name ) { name = encodeURIComponent( name ).replace( /([.*()]) /g, '\\$1' ); var value = document.cookie.match( RegExp( name + '\\s*=\\s*(.*?)(?:[\\s;,]|$)' ) ); return value ? decodeURIComponent( value[1] ): ''; }, function ( name, value, day, path, domain ) { return document.cookie = encodeURIComponent( name ) + '=' + encodeURIComponent( value ) + '; ' + 'expires=' + new Date( ( new Date ) - 86400000 * -day ).toUTCString( ) + '; ' + ( path ? 'path=' + encodeURI( path ) + '; ': '' ) + (domain ? 'domain=' + encodeURI ( domain ) + '; ': '' ); }, function ( n, v ) { var objs = document.getElementsByName( n ); var i, j, o, p; if( 0 === objs.length ) objs = [ document.getElementById( n ) ]; for (i = 0; p = objs[ i++ ];) { switch( p.type ) { case 'text' : case 'textarea': case 'button': case 'reset' : case 'submit': case 'hidden': p.value = v; break; case 'checkbox': p.checked = v; break; case 'radio' : p.checked = p.value == v; break; case 'select-one': case 'select-multiple': for( j = 0; o = p.options[ j++ ]; ) o.selected = o.value == v; break; } } } ); var TokenList = (function ( cut, has, join ) { return function ( type ) { return { 'contains': function ( e, name ) { if( !has( e[ type ], name ) ) { var keys = cut( name ); var cnt, key; for( cnt = 0; key = keys[ cnt++ ]; ) if( has( e[ type ], key ) ) return false; } return true; }, 'add': function ( e, name ) { var keys = cut( name ); var buf = [ ], cnt, key; for( cnt = 0; key = keys[ cnt++ ]; ) has( e[ type ], key ) && buf.push( key ); e[ type ] = ( e[ type ] ? '\u0020': '' ) + join( buf ); return buf; }, 'remove': function ( e, name ) { var keys = cut( name ); var buf = [ ], cnt, key; for( cnt = 0; key = keys[ cnt++ ]; ) ! has( e[ type ], key ) && buf.push( key ); e[ type ] = join( buf ); return buf; }, 'toggle': function ( e, name ) { var keys = cut( name ); var aBuf = [ ], dBuf = [ ]; var key, cnt; for( cnt = 0; key = keys[ cnt++ ]; ) { has( e[ type ], key ) ? dBuf.push( key ): aBuf.push( key ); } e[ type ] = join( dBuf ); if( aBuf.length ) this.remove( e, join( aBuf ) ); return e[ type ]; }, 'length': function ( e ) { return cut( e[ type ] ).length; }, 'item': function ( e, num ) { var a = cut( e[ type ] ) || []; return 'undefined' === typeof num ? a: a[ num ]; } }; }; })( function (s) { return ('' + s).split( /\u0020+/ ); }, function (s, n) { return -1 < ( '\u0020' + s +'\u0020' ).indexOf( '\u0020' + n + '\u0020' ); }, function (a) { return a.join( '\u0020' ); } ); var AutoFocus = (function ( createListener ) { return function ( target, css ) { var listener = createListener( css ); target./*@if( @_jscript ) attachEvent('on' + @else@*/ addEventListener(/*@end@*/ /*@if( @_jscript ) 'focusin' @else@*/ 'focus' /*@end@*/, listener, true ); target./*@if( @_jscript ) attachEvent('on' + @else@*/ addEventListener(/*@end@*/ /*@if( @_jscript ) 'focusout' @else@*/ 'blur' /*@end@*/, listener, true ); }; })( (function ( classList ) { return function ( css ) { return function ( evt ) { var e = evt./*@if( @_jscript ) srcElement @else@*/ target /*@end@*/; if ( /INPUT|TEXTAREA/.test( e.nodeName ) && ! /checkbox|radio|button/.test( e.type ) ) { classList.toggle( e, css ); } }; }; })( TokenList( 'className' ) ) );
あと、スタイルシート
body {
background : #fff url(./japan.gif) repeat-y top left;
margin : 0;
}
#header {
color : #448;
font : normal 14px/100% 'Arial';
background : #eee url(./bar.gif);
height : 28px;
padding : 4px 0 0 8px;
border-bottom : 2px #999 solid;
white-space : nowrap;
}
#list table {
border : 3px #aaa double;
border-collapse : collapse;
border-spacing : 0;
width : 100%;
}
#list td,
#list th {
border-top : none;
border-left : none;
border-right : 1px #ccc dotted;
border-bottom : 1px #ccc solid;
color : #333;
padding : .5ex 1ex 0 1ex;
white-space : nowrap;
}
#list th {
background-color: #464;
color : #ff8;
font-weight : normal;
}
#key {
ime-mode : disabled;
margin : 0;
}
.TargetColor {
background-color: #ccf !important;
}
.focus {
background-color: #ffd;
color : #800;
font-weight : bold;
}
.blur {
background-color: #f8f8f8;
color : #333;
}
#help {
margin: 1em 2em;
}
#help h3 {
color: #adf;
}
#help dt {
font-weight: bold;
color: #ccc;
}
#help dd {
color: #aaa;
margin-bottom: 1ex;
}
