dポイントプレゼントキャンペーン実施中！

日本語入力の禁止

締切済

  • 質問者：sakukou10
  • 質問日時：
  • 回答数：3件

お世話になります。

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;
}

よろしくお願いします。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

A 回答 (3件)

No.3

ｆｍ……まぁ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>
    • good
    • 0
    • 件
通報する
この回答へのお礼

ありがとうございます。

keycodeばっかりに目がいってそういう発想がでてきませんでした。
ただ、IE8だとやはり書き込めちゃうみたいですが
何とかなりそうな気もしてきました。

IE8といってもXPのIE8で、vista以降のIE8だとkeycodeの取得もうまくいってるので
もしかするとIMEのバージョンの違いとかそういうので変わってくるんでしょうか。

通報する
お礼日時：2013/04/19 10:23

No.2

あれ？……これで動かない？



<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>
    • good
    • 0
    • 件
通報する
この回答へのお礼

ありがとうございます。

提示していただいたコードで試してみましたが、
日本語は入力できてしまいました。

IE9だとうまくいったのですが、IE8だと駄目でした。
IE8と9で何かが違うんですかね。

通報する
お礼日時：2013/04/18 10:30

No.1

それ……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内に日本語が書かれてしまいます。

補足日時：2013/04/15 12:53
通報する
    • good
    • 0
    • 件
通報する

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう！

Q質問する（無料）

関連するカテゴリからQ&Aを探す

ページトップページトップ

Q質問する（無料）

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング

おすすめ情報