サンプルをダウンロードしてください。

2-2-1.講座概要

さて今回の講座ではひらがなからローマ字の問題を作成する方法を学びます。 なぜそんなことをするのか？ それには理由があります。

まず第一にキーセッティング機能を搭載したい場合に作りやすいからです。 キーセッティング機能を搭載する場合は同時に入力方法をユーザーに指定してもらうのですが、 毎回セッティングするのは苦労するのでクッキーを使わないとあまり使われない機能になってしまうかもしれません。

そして次の良い点としては、例えばローマ字の問題を作成者が作ったとします。 そうすると少なからず問題が増えるごとに入力方法が別の問題ができてしまいます。 『ジルバ』という文字列があったとして、作成者がこのローマ字の問題を作るとします。 そうすると

『jiruba』、『ziruba』

二つの入力方法があり、作成者が必ず統一された入力方法で問題を作成するとは限りません。

そういう理由もあって『ひらがな』から『ローマ字』の作成をスクリプトでしてしまおうというのが 今回の講座です。 実際のサンプルをやっても前回の講座と同じですがスクリプトは格段に量が増えております。

2-2-2.JavaScript解説

今回のHTML部分は前回講座と同じものなので解説はしません。

今回は前回のスクリプトを変更していってますので、前回のスクリプトを改造して作成するのもいいでしょう。

まずは変更した箇所ですが、ひらがなからローマ字に変換する関数change()の追加と、startset()関数内で ローマ字のリストを作成していた部分をひらがなの文字に変換して変数の名前も変更しました。 同じような変数がいくつもあってまぎらわしいのでそこは変更しておくといいかもしれません・・・。 あとはひらがなをローマ字に変換する際に利用するひらがなリスト、ローマ字変換用のリストを作成しました。 ここでローマ字変換用の部分は入力方法によって変更することで固定した入力方法にすることができます。 change()関数内の特殊変換部分も同じようにすることで変換できます。
このやり方よりより良い方法はいくつもありますので、いろいろ試行錯誤してみてください。 たぶん2次元配列でリスト作成した方が効率がいいかもしれません。

さて実際にchange()関数で行われてることを見てみましょう。
スクリプト量が多いので大まかに説明させていただきますが、用はランダムに選んだ問題のひらがなを 一文字ずつローマ字のリストによって変換させているのです。 実際は問題のひらがなの一文字がhiraganachangeリストの中で一致した場合、ro_machangeリストの同じ 要素数からローマ字を取り出しそれを文字列に追加していく作業です。

ただ例外がありまして、例えば『きゃっと』という文字列があったとします。
これは小さい『ゃ』と『っ』が入っています。これはそのままでは使われることがないので変換する際に 前の文字や後の文字から判断してローマ字を作成しなければいけません。 その為の処理が長々と書いているスクリプトです。
例えば現在『き』という文字を指しているとします。これは『ki』に変換したいですが、次に小さい『ゃ』 がきているので実際には『kya』と変換したいので、次の文字が小さい文字かどうかを見て変換するという ことをしています。
実際の『きゃ』への変換には次のようなスクリプトを組んでいます。（一部だけ抜粋してあるのでわかり辛いかもしれません）

}else if(sellect.charAt(i+1)=="ゃ"){
　if(sellect.charAt(i)=="き"){
　ro_ma+="kya";
}

sellectという変数はランダムに選んだ問題のひらがな部分が入っています。

さてスクリプト量が長いので一行づつ解説はしませんが、やっていることはみな同じです。 ただ一部違う部分があるので、そこを解説します。

}else if(sellect.charAt(i)=="っ"){
　for(j=0;j<hiraganachange.length;j++){
　　if(sellect.charAt(i+1)==hiraganachange[j]){
　　　ro_ma+=ro_machange[j].charAt(0);
　　}
　}
}else{
　for(k=0;k<hiraganachange.length;k++){
　　if(sellect.charAt(i)==hiraganachange[k]){
　　　ro_ma+=ro_machange[k];
　　}
　}

さてこの部分ですが上のelse if文では現在の文字が小さい『っ』の時です。小さい『っ』は特殊で次に来る文字によって 変わってきます。例えば『はってん』という文字列の場合『hattenn』、『はっかん』という文字列の場合は『hakkann』 とそれぞれ『t』と『k』の連続によって打つことができますが、ひらがなでは同じ小さい『っ』です。 これを実現する為に次の文字をhiraganachangeリストより探し、その一番目の文字を取り出しています。 なぜこれで実現できるかというと、小さい『っ』の後の文字の2回続きによって小さい『っ』というものが打てる からです。実際に取り出すのは見つかったhiraganachangeリストと同じ要素番号のro_machangeリストの0番目の 文字です。

さて次のelse文ですが、これは今までの条件でひっかからなかった場合通常通りの変換を行う処理です。 現在見ているひらがなとhiraganachangeリストを見比べて同じだったらro_machangeリストから同じ要素番号の ものを取り出して文字列の作成をしています。

さて、今回の講座終了です。 少し難しい処理なので、わからない場合は質問掲示板にどうぞ。 本当にわからない場合はローマ字の問題リストを普通に作っていただいても問題ありませんし、 スクリプトをコピーするだけでもかまいません。
自分で作っててなんなんですが・・・、このスクリプトキーセッティング機能をつけたい 場合結構改良しないとできないっぽいんだけど・・・（汗） スクリプトの改良が必要ですな・・・。