designMode=on のキーイベント処理

このQ&Aのポイント
  • HTMLエディタを使ったWEBアプリケーションで、Mozillaの場合、designMode=onのキーイベントが反応しない問題が発生
  • WindowsXP上でFirefox 2.0.0.4を使用している場合、designMode=onのキーイベントが反応しない
  • 質問者は誰かがこの問題を解決できるかどうか知りたいとしています
回答を見る
  • ベストアンサー

designMode=on のときのキーイベント処理

HTMLエディタを使ったWEBアプリケーションを作っているのですが、 designMode=onにしてインナーフレームを編集可能にしたとき、 Mozillaの場合、キーイベントが反応せず困っております。(IEでは動きます) どなたか、ご存知のかたは教えてください。 よろしくお願いします。 OS : WindowsXP ブラウザ:firefox 2.0.0.4 ・ソース <html> <head> <script type="text/javascript"> var doc=null; function init(){ var doc = document.getElementById("testFrame").contentWindow.document; doc.designMode = "on"; doc.onkeydown = test; } function test(){ alert("OK"); } </script> </head> <body onload='init();'> <iframe id="testFrame" width="500px" height="500px" ></iframe> </body> </html>

  • ke79
  • お礼率83% (5/6)

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

  • ベストアンサー
回答No.1

こんな風にtextarea要素を使わなかった理由はあるのかな? <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <style type="text/css"> </style> <script type="text/javascript"> var doc=null; function init(){ var doc = document.getElementById("testarea"); doc.onkeydown = test; } function test(){ alert("OK"); } </script> </head> <body onload='init();'> <p><textarea rows="200" cols="200" id="testarea"></textarea></p> </body> </html> ↓一応方法はあることはあるんで、補足なりお礼なりでそこだけ聞きたいな。(contentWindowじゃなくてdocのメソッドでもいけた) http://www.thescripts.com/forum/thread151221.html

ke79
質問者

お礼

himajin100000様、おかげで解決しました。 ありがとうございました!

関連するQ&A

  • インラインフレームのキーイベント

    IE7のインラインフレームでキーイベントを取得しようとしているのですが、オブジェクトがありませんとエラーになってしまいます。 こちら通常の場合は上手くいくのですが、 <html> <head> <meta http-equiv="content-type" content="text/html; charset=shift_jis"> <title>HTML Editor</title> <script type="text/javascript"> document.onkeydown = function(e) { var shift, ctrl; keycode = event.keyCode; ctrl = event.ctrlKey; shift = event.shiftKey; // キーコードの文字を取得 keychar = String.fromCharCode(keycode).toUpperCase(); // Ctrl同時押しの場合 if (ctrl) { if (keychar == "C") { alert('Ctrl+C'); } } } </script> </head> <body id="oBody"> <span id="editSpan"> <iframe id="oIframe" style="width:100%;height:50%"> </iframe> </span> </body> </html> 次のようにインラインフレームの中で行おうとするとエラーになってしまいます。 <html> <head> <meta http-equiv="content-type" content="text/html; charset=shift_jis"> <title>HTML Editor</title> </head> <body id="oBody"> <span id="editSpan"> <iframe id="oIframe" style="width:100%;height:50%"> </iframe> </span> <script type="text/javascript"> oIframe.document.onkeydown = function(e) { var shift, ctrl; keycode = event.keyCode; ctrl = event.ctrlKey; shift = event.shiftKey; // キーコードの文字を取得 keychar = String.fromCharCode(keycode).toUpperCase(); // Ctrl同時押しの場合 if (ctrl) { if (keychar == "C") { alert('Ctrl+C'); } } } </script> </body> </html> なにか解決方法ありますでしょうか。 よろしくお願いします。

  • postMessageによるiframeの書き換え

    iframeに表示している自身のブログを作成・修正するスクリプトを考えていますがうまくいきません。 「contentWindowで取得した変数の属性は読み取り専用なので、変数を操作するにはpostMessageを使う必要がある」といった記事があったので、自分なりにスクリプトを書いてみました。以下が、そのサンプルです。 親のparentから子のiframeに変数var1をpostMessageで送り、子側で変数var1を使ってoutputの内容を書き換えています。 しかし、これだとcontentWindowで変数を取得・操作を行なった場合と何ら変わらない結果になってしまいます。 つまりiframe.htmlを直接ブラウザで開いて表示しても、outputの表示内容が書き換わっていません。 どこに誤りがあるのでしょうか。 それとも「読み取り専用」に関する私の理解が間違っているのでしょうか。 <html lang="ja"> <head> <meta charset="UTF-8" /> <title>parent</title> </head> <body> <iframe id="iframe" src="iframe.html"></iframe></br> 天気<input type="text" id="var1" value=""> <input type="button" id="build" onclick="send()" value="データ送付"> <script type="text/javascript"> function send(){ var win = document.getElementById("iframe").contentWindow; win.postMessage(document.getElementById("var1").value, '*'); } </script> </body> </html> <html lang="ja"> <head> <meta charset="UTF-8" /> <title>iframe</title> </head> <body> <p>タイトル</p> <div id="output"></div> <div id="var1"></div> <script type="text/javascript"> window.addEventListener('load', function(){ var var1 = "晴れ"; build(var1); }); function onMessage(e) { var var1 = e.data; build(var1); } window.addEventListener("message", onMessage, false); function build(var1) { var output = "きょうは" + var1 + "です。"; document.getElementById("output").innerHTML = output; } </script> </body> </html>

  • JavaScript テキストボックス キーイベント

    JavaScript テキストボックス キーイベント こんにちは。趣味でプログラミングをしている者です。 タイマーを使って計算ドリルを作ったのですが、 特定のキーコードで正解かどうか判定する関数を呼び出そうとしたのですが、 テキストボックスにこたえを入力して、キーを押すたびに 「キーン」というような音が鳴るのですが、 その音は、どのような仕組みで鳴るのでしょうか? また、音を鳴らさないようにする方法がありましたら、 教えていただけないでしょうか よろしくお願いします <html> <head> <script type="text/javascript"> function init() { document.attachEvent("onkeypress", KotaeAwase); } function KotaeAwase() { if( event.keyCode == 13) { var key = 1; var kotae = parseInt( document.Form1.kotae.value ); var Result = document.Form1.result; if( kotae == key ) Result.value = "せいかいです!"; else Result.value = "ちがいます"; } } </script> </head> <body onLoad="init();"> <form name="Form1"> <input type="text" name="kotae" size="20"> <br><br> <input type="text" name="result" size="20"> <br> </form> </body> </html>

  • Flashのキーイベント処理について

    Flashのキーイベント処理でなかなか不具合が取れず、困っています。 よろしくお願いします。 今作っているFlashは1つのデータ内に複数のページが存在し、ページごとにキーイベント処理内容が異なる仕様のため、それぞれにキー処理を行っています。 内容は、下のようなスクリプトを書いています。 -<ページ(1)でのクリアキー判定>---------------- var Key_object = new Object(); Key_object.onKeyDown = function(){ code = Key.getCode(); if(code == 46){ //終了処理 } } Key.addListener(Key_object); ----------------------------------------------- -<ページ(2)でのクリアキー判定>---------------- var Key_object2 = new Object(); Key_object2.onKeyDown = function(){ code2 = Key.getCode(); if(code2 == 46){ //ページ(1)へ戻る処理 gotoAndPlay("page1"); } } Key.addListener(Key_object2); ----------------------------------------------- ですが、上の処理だとページ(2)でクリアキーを押した時にページ(1)に戻ってほしいのに、何故かページ(1)のクリアキー判定まで行われてしまい、終了処理がなされてしまいます。 この件についての原因と打開策が知識の乏しい私では見当たりません。 また、違う人に聞いたところ「ページ(2)でのクリアキー判定の方はイベントリスナーを使わずにキー判定を実装して」といわれました。 このイベントリスナーを使わずにクリアキーの判定を実装する方法がわかりません。 どなたか、上のスクリプトでの不具合原因や打開策、また「イベントリスナーを使わないクリアキーの判定方法」が分かる方、いらっしゃいませんでしょうか?

    • ベストアンサー
    • Flash
  • クッキー取得処理のジャバスクリプトを拾ってきたんですが、壊れているのか効きません。

    これなんですが、firefoxIE6とどれも効いてくれないのですが、なぜなんでしょうか? 僕の設定がおかしいのでしょうか。 head内に設置しているんですが、どうすれば効いてくれるようになるんでしょうか? <script type="text/javascript"> <!-- //ページ読み込み時に発生する。(bodyのonLoadイベントで呼び出し) function init() { //クッキー取得処理を呼び出し、戻り値をcoocに代入 var cooc = getCookie(); //戻り値がOKの場合はクッキーが存在するのでb.htmlに飛ばす if (cooc == "OK") { location.href="b.htm"; } } //クッキー取得(取得できればOK、できなければNGを返す) function getCookie(){ //当日日付取得 var today = new Date().getTime(); //クッキー取得 var doc = document.cookie+";".indexOf("test="); //クッキーが取得できなければindexOfで-1が返されるのでif文で判別 if(doc != -1){ return("OK"); } else { //取得できなければクッキーを食べさせる。(expires=有効期限) document.cookie = "test=1;expires="+new Date(today + (60 * 60 * 24 * 1000 * 1)); return("NG"); } return(""); } //--> </script>

  • designModeをOnにしたインラインフレームに入力した文字を取得

    Webページ上にインラインフレームを定義して、その中身のdesignModeをOnにして、インラインフレームのBODYを編集できるようにしています。 JavaScriptで編集したBODYの中身の文字列を取り出したいのですが、方法が分かりません。アドバイスをお願いします。 ソースは↓のような感じにしています。 ----- <html> <body> <iframe src="" id="edit" width="200" height="200"></iframe> <script language=JavaScript> <!-- frames[0].document.designMode = "On"; // --> </script> <br> <input type="button" onclick="JavaScript:DispEdit();" value="中身表示"> <script language=JavaScript> <!-- function DispEdit() { //alert(frames[0].document.body.text); //ここで編集したiframeの中身を取り出したい! } --> </script> </body> </html> -----

  • IFRAMEのscrollingを常にnoにしたい

    iframeを使ってBBSをscrolling="no"で表示したいのですが、 src="パスワード.cgi"から自動でbbs.cgiになったときにスクロール表示してしまいます。 iframe内で表示先が変更された場合でもスクロール表示しないようにできるのでしょうか?もしできるのであれば教えていただきたいのですが… 掲示板をiframe と言うことで、某ホームページをを参考にスクロールが表示さ れないようにしてみました。 が以下のようにパスワードを入力後に表示するiframe はスクロールを表示して しまいます。 <script type="text/javascript"> <!-- function LoadFrame(frid) { var IFR = document.getElementById(frid); IFR.style.height = (IFR.contentWindow)? IFR.contentWindow.document.body.scrollHeight: document.frames[frid].document.body.scrollHeight; } //--> </script> <iframe src="member/gate.cgi" name="coach" onload="LoadFrame(this.id)" id= "Ifr" width=497 frameborder="0" scrolling="no"></iframe> 試行錯誤しながらなんとかやってる超初心者です。よろしくお願いします。

  • JSP内でのデータ取得

    <script> <!-- function getTime(){ var time = document.getElementById("time");   } --> </script> <html> <head><title>テスト</title></head> <body> <% ここで「time」を取得する %> JSPで、<script>内の処理のデータを、「 <% ~ %> 」の中で受け取ることって可能なのでしょうか?

  • Firefox/2 カーソルが砂時計のまま while(line=str.shift()){

    <html> <head> <script type="text/javascript"> function init(){ var str="a:b:c".split(/:/); var line; while(line=str.shift()){ document.write(line + "<BR>"); } } </script> </head> <body onload="init()"> </body> </html> 上記をFirefox/2(Win XP)で実行すると、カーソルが砂時計のまま戻りません。(IE6では再現視せず) 回避策ありましたら教えてください。

  • iframeのソースを取得したい

    いつもお世話になります。 物凄くまとめてしまってすみません。 window.onload = alert(document.getElementsByTagName("body")[0].getElementsByTagName("iframe")[0].contentWindow.document.innerHTML); というようなスクリプトを実行しているのですが、未定義(undifined)が表示されてしまいます。 もちろんbodyないにちゃんとしたsrcを指定したiframeはあります。 どのようにすればいいでしょうか。 よろしくお願いします。