こんにちはゲストさん。会員登録(無料)して質問・回答してみよう!

解決済みの質問

JavaSc「-」を入力して「-」を表示しないとは

document.body.onkeydown=pressKey;
function pressKey(e)
{ keyNum=e.keyCode;
if(keyNum>=65 && keyNum<=90){ keyNum=keyNum+32;}
keyChar=String.fromCharCode(keyNum);
document.getElementById("area").innerHTML=keyChar;
}
<div id="area"></div>

HTML、JavaScriptのこんな感じのプログラムで
「a」を入力するとキーコードが発生するので
(ただし、ローマ字は大文字の「A」がヒットするので)
拾って(大文字なら小文字に変換する)
文字に変換して <div id="area"></div> の内容として
タイプするとリアクションでその場で表示できます。
「a」と打つなら「a」が現れる仕掛けです。

同じことがハイフン入力でできません。
(ノートPC使用、「0」の隣。)
キーコードをアラート表示すると189でした。
これはアスキー文字コード128以上の一覧にあって
文字としては1文字で1/2を表示するというものでした。

タイピングソフトを自作してこれに気付きました。
ハイフン入力にその表示が正常にできないということは
このままではお題に伸ばし棒入りの文章が使えません。
英文例題に伸ばし棒(半角ハイフン、コードは45)があっても
入力はコード189を発生するので一致判定ができません。
というか、入力動作で
if(keyNum==189){ keyNum=45;}
ハイフンのコード45に修正する作業をわざわざ差し込みました。

動作的にはこの対応で完成させたのですが、
ハイフンを入力したらハイフンキーのコード45を発生せずに
他のコードの発生させる機種は、
この仕掛けに何の意味やメリットがあるのか思い当たりません。
設定異常の症状でしょうか?

投稿日時 - 2018-09-21 11:06:38

QNo.9539434

暇なときに回答ください

質問者が選んだベストアンサー

>設定異常の症状でしょうか?

javascriptのonkeydownは押されたキーの「キー番号(アスキーコードとは異なるコード)」をkeyCodeに返す仕様になっています。

この「キー番号」は、フルキーボード側の0~9、A~Zのキーについて、0~9、A~Zのアスキーコードと同じ数値になるようにキー番号を合わせてあります(番号をアスキーコードに似せてあるだけで、アスキーコードが返されている訳ではない事に注意すること)

それ以外のキーは「アスキーコードと異なるコード」が返って来ます。

例えば、テンキーの「0」(ゼロ)は96、フルキーの「0」(ゼロ)は64を返すようになっています。

例えば、テンキーの「-」(マイナス)は109、フルキーの「-」(マイナス)は189を返すようになっています。

この時「=」(SHIFT押しながら「ー」キー)は「-」キーと同じ番号の189になります。

ですので、onkeydownは「-」と「=」を区別出来ません。どちらも「189」が返されます。

「押したキー入力を、アスキーコードで知りたい」と言う場合は「onkeypress」を使います。

onkeypressであれば「ー」キーは45(アスキーコードの「-」)を返し、「=」キーは65(アスキーコードの「=」)を返し、「a」は97、「A」は65のように、大文字も小文字も区別して返されます。

以下のサイトで「onkeydownとonkeypressの違い」を比較できます。
https://web-designer.cman.jp/javascript_ref/keyboard/keycode/

>この仕掛けに何の意味やメリットがあるのか思い当たりません。

onkeydownは、実は「javascript仕様での、キーの物理番号」を返しています。

「キーの物理番号」を返すので「テンキーの数字キーと、フルキーの数字キー」を区別できます。同様に「テンキーの*と、フルキーの*(:)」も区別できます。

また「SHIFTキーを押しただけ」とか「CTRLキーを押しただけ」も判ります。

これが出来るのは「アスキーコードとは異なる、キーの物理番号」を返すようになっているからです。

投稿日時 - 2018-09-21 12:22:04

お礼

私が参照した教本では、機能が「どんなコード規格でやるものなのか」
説明はありませんでした。
キーコードがアスキーコードとどう違うものなのか
わかっていないと手ごわかったです。
なかなかたどり着けなかった情報でした。
非常に助かります。すっきりしました。
ありがとうございました。

投稿日時 - 2018-09-21 14:33:53

このQ&Aは役に立ちましたか?

0人が「このQ&Aが役に立った」と投票しています

回答(1)

あなたにオススメの質問