- 締切済み
日本語入力の禁止
お世話になります。 divにcontenteditable属性を付与して編集できるようにしました。 そのとき、日本語は入力禁止にしたいのですがime-modeはdivには使用できないみたいです。 日本語入力のときはkeycode229が返ってくるようなのでjavascriptでonkeydownのときに if (event.keyCode == 229) { return false; } というif文を入れてみました。alertとかで確認するとちゃんと日本語入力の時にはこのif文を通過しているみたいなのですが 日本語が入力されてしまいます。 div contenteditable=trueのときに日本語入力を禁止したい場合はどのようにすれば実現できるのでしょうか。 <div contenteditable=true onkeydown="return test();">編集テスト</div> function test() { if (event.keyCode == 229) { return false; } return true; } よろしくお願いします。
- sakukou10
- お礼率56% (42/75)
- JavaScript
- 回答数3
- ありがとう数2
- みんなの回答 （3）
- 専門家の回答
みんなの回答
- CyberCypher
- ベストアンサー率73% (39/53)
ｆｍ……まぁie８とかcss3、html5未対応の記述もあるし まーた、IEのバグな気もするんだけど…… keycode取得出来ないなら発想を変えればいいじゃない！ ……てことで考えてみた keydownとkeyup時、入力された項目をチェック byte数と文字数が一致すれば保存し 一致しなければ直前のデータで上書き (※半角文字は1byte、全角文字は2byteあります) <html> <head> <script type="text/javascript"> <!-- var beforeData = ""; function isMultiByte(){ var strVal = document.getElementById('target').innerHTML; var strByte = strSize(strVal); if(strVal.length == strByte){ beforeData = strVal; }else{ document.getElementById('target').innerHTML = beforeData; } } function strSize(data) { var byte = 0; for (var i = 0; i < data.length; i++) { var c = data.charCodeAt(i); if ( (c >= 0x0 && c < 0x81) || (c == 0xf8f0) || (c >= 0xff61 && c < 0xffa0) || (c >= 0xf8f1 && c < 0xf8f4)) { byte += 1; } else { byte += 2; } } return byte; } window.onload = function(){ window.document.onkeydown = function(evt){ isMultiByte(); } window.document.onkeyup = function(evt){ isMultiByte(); } } // --> </script> </head> <body> <div id="target" contenteditable="true">test</div> </body> </html>
- CyberCypher
- ベストアンサー率73% (39/53)
あれ？……これで動かない？ <html> <head> <script type="text/javascript"> <!-- window.onload = function(){ window.document.onkeydown = function(evt){ if (evt){ if(evt.keyCode == 229){ evt.keyCode = 0; return false; } }else{ if(event.keyCode == 229){ event.keyCode = 0; return false; } } } window.document.onkeyup = function(evt){ if (evt){ if (evt.keyCode != 13){ event.keyCode = 0; return false; } }else{ if (event.keyCode != 13){ event.keyCode = 0; return false; } } } } // --> </script> </head> <body> <div contenteditable=true>編集テスト</div> </body> </html>
お礼
ありがとうございます。 提示していただいたコードで試してみましたが、 日本語は入力できてしまいました。 IE9だとうまくいったのですが、IE8だと駄目でした。 IE8と9で何かが違うんですかね。
- CyberCypher
- ベストアンサー率73% (39/53)
それ……keydown時？keyup時？ keydown時に if (event.keyCode == 229) return false; が効くのがIE、Chrome、Safari firefoxは少し特殊でkeydown時229以外且つkeyup時 if (event.keyCode == 13){ //日本語じゃない } で判別かな
補足
回答ありがとうございます。 質問文中にも記載していましたが、keydown時です。 記載忘れでしたがIE8での動作確認です。 keydown時に229で判別して、半角/全角キーを押したときに229が取得できることは 確認できたのですが、そのあと、日本語を入力すると、 入力確定前の文字が書き込まれて、確定すると普通にDIV内に日本語が書かれてしまいます。
お礼
ありがとうございます。 keycodeばっかりに目がいってそういう発想がでてきませんでした。 ただ、IE8だとやはり書き込めちゃうみたいですが 何とかなりそうな気もしてきました。 IE8といってもXPのIE8で、vista以降のIE8だとkeycodeの取得もうまくいってるので もしかするとIMEのバージョンの違いとかそういうので変わってくるんでしょうか。