FireFoxでのouterHTMLについて

このQ&Aのポイント
  • JavaScriptでouterHTMLを使用する方法について、FireFoxとIEの違いによる対処法を教えてください。
  • FireFoxではouterHTMLがサポートされていないため、書き換えたいタグの属性を変更する代替方法を知りたいです。
  • FireFoxでouterHTMLの代わりに使用できるJavaScriptの方法について教えてください。
回答を見る
  • ベストアンサー

FireFoxでのouterHTMLについて

JavaScriptでわからないことが出てきました。 ご教授いただければ幸いです。 現在、IEとFireFoxの両方で動作するウェブプログラムを作成しています(IEは6.0、FireFoxは2.0です)。 開発環境はVisual Stadio2005 & .NET Framework version 2.0です。 そこで、都合によりouterHTMLを試用したいのですが、FireFoxでは未サポートのため、困っております。 <input id="aa" type="text" /> といったような内容のタグを書き換えたいのですが、 (厳密には、Javascriptでonclickなどの属性を追加したいのです。) outerHTMLの代わりとなるようなJavaScriptはないものでしょうか? ご存知の方がいらっしゃいましたら、ご教授よろしくお願いします。

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

  • ベストアンサー
  • yambejp
  • ベストアンサー率51% (3827/7415)
回答No.1

outerHTMLなんて使うもんじゃないですね・・・ windowのonloadメソッドとしてidで指定したオブジェクトに対して onclickメソッドを追加してあげてください。 <html> <head> <script language="javascript"> window.onload=function(){ var aa=document.getElementById('aa'); aa.onclick=function(){alert("ほげ");} } </script> </head> <body> <input id="aa" type="text" /> </body> </html>

takeru427
質問者

お礼

ありがとうございます。 求めていた処理が出来ました。 感謝感謝です。

関連するQ&A

  • FireFoxについて

    JavaScriptを勉強中のものです。 単純に、『テキストボックスの文字色を変えるだけ』のスクリプトを組んだのですが、 IEでは動いて、FireFoxでは動かない、という状況に陥っています。 ソースは下記のとおりです。 -------------------------------------------------------------------------------------------------------------------- <html> <head> <Script Language=JavaScript> function js_ClickBtn_Blue() { document.getElementsByName("txt1")(0).style.color = "blue"; } function js_ClickBtn_Red() { document.getElementsByName("txt1")(0).style.color = "red"; } </Script> </head> <body> <input type=text name=txt1 value="あいうえお"> <br> <br> <input type=button name=btn1 value="青" style='color:blue;' onClick='js_ClickBtn_Blue();'> <input type=button name=btn1 value="赤" style='color:red;' onClick='js_ClickBtn_Red();'> </body> </html> -------------------------------------------------------------------------------------------------------------------- なぜ、IEでは動いて、FireFoxでは動かないのでしょうか? 【知りたいこと】  ・FireFoxで動かない理由  ・FireFoxでテキストボックスの文字色をJavaScriptで変更するには   どういった実装をしたらよいか ちなみに環境は、 【パソコンのOS】Windows7 Enterprise 【ブラウザ】 Internet Explorer 8 FireFox 40.0.2 です。 知っている方いましたらご教授お願いします。 以上です。

  • JavaScriptがFirefoxで動かない・・・

    よろしくお願いいたします。 IEでは正常に動作するのですが、Firefoxで実行してみると ボタンを押しても何の反応もありません。 どのように変更すればFirefoxで動作するのでしょうか? よろしくお願いいたします。 <SCRIPT LANGUAGE="JavaScript"> <!-- function warning(){ alert("テストです。"); } //--> </SCRIPT> <FORM><INPUT type="button" value="ボタンを押して。" onClick="warning()"></FORM> 上記のコードを外部に独立させて・・・ 【コード】 <script type="text/javascript" src="sample3.js"></script> <input type = "button" name = "button3" value = "sample3" onclick = "Func3();"> 【sample3.js】 function Func3() { alert("js外部ファイル記述"); } です。 FC2ブログで活用したいのですが・・・ 改行の扱いは「HTMLタグのみ」に設定しています。 ご回答、よろしくお願いいたします。

  • Firefoxでwindow.close()が効きません

    Win、MacともIEでは問題ないのですが、Firefoxでwindow.close()が効きません。 Firefoxのバージョンは、Windows→1.0.7、Mac→1.5.0.1です。 ソースは以下のとおりです。 <form> <input type="button" name="Submit" value="ウィンドウを閉じる" onClick="javascript:window.close();"> </form> また、以下の方法も試してみたのですが動作しませんでした。 <SCRIPT language="JavaScript"> <!-- function CloseWin(){ window.close(); } // --> </SCRIPT> <FORM> <INPUT type="button" value="ウィンドウを閉じる" onClick="CloseWin()"> </FORM> aタグのターゲットブランクで別ウィンドウを開いた場合です。よろしくお願いいたします。

  • リンクタグについて

    教えてください。 <a>タグからFormを動かしたため下記のような記述を致しました。 この記述では、IE7、Firefoxでは動作するのですが、IE6では動作しません。IE6で動作させるにはどのような記述をすればよいのでしょうか? <a href="javascript:void(0)" onClick="document.frm.submit();">クリック</a> <form method="post" action="#" name="frm"> <input type="text" name="aaa" /> </from>

  • Firefoxでクリックした時の座標の取得の仕方がわかりません

    JavaScriptを使って、ある画像をクリックした時の座標を知りたいのですが、 Firefoxではうまく取得できません。 ImageタグのOnClickでファンクションを呼んで、ファンクションの中で mdx= parseInt(e.pageX); としたのですが、間違いでしょうか。 同じようにImageタグのOnClickでファンクションを呼んで、その中で mdx = event.x; とした場合IEではうまく取得できました。 よろしくお願いいたします。

  • IEだと良いがFireFoxだと動作しない

    次のようなプログラムを組みました。 他にも色々と作ったのですが、どれも 「送信」ボタンを押してもウンともスンとも言いません。 「JavascriptをONにしてください」メッセージも出ず FireFoxが動いているPCは何台かあるのですが(OSはWindowsXPおよびDebian) どれも同じです。 FireFoxには対応していないものを入れているのだと思いますが…。 ---------------------------------------------------------- <SCRIPT> <!-- function etymonline() { location.href="http://www.etymonline.com/index.php?search=" + kensaku.value + "&searchmode=none"; } // --> </SCRIPT><noscript>JavascriptをONにしてください。</noscript> <INPUT size="10" type="text" name="kensaku"><INPUT type="submit" value="送信" onclick="etymonline()">

  • javascriptがFirefoxで効かない

    いつもお世話になります。 見よう見まねでやっている初心者です。 下記のようなボタン2個とjavascript でpostする先をわけようと思っているのですが、 IEですと動くのですが、FirefoxとGoogle Chrome では全く動きません。 これをFirefoxとGoogle Chromeでも動かせるのにはどう書けば宜しいのでしょうか? できたら具体的に式を書いて頂けると大変助かります。 どうかご教授の程よろしくお願い致します。 <input type="button" value="new" onclick= "test_new()"> <input type="button" value="edit" onclick= "test_edit()"> function test_new(){ var postform = document.getElementById("register"); postform.action = './test_new.php'; postform.submit();} function test_edit(){ var postform = document.getElementById("register"); postform.action = './test_edit.php'; postform.submit();}

  • javascriptの記述方法

    javascriptをhtml内に記述する時、 <script type="text/javascript> ~~処理~~ </script> だと思っています。 ただ、ボタンをクリックした時に、メッセージが表示される簡単なHTMLをonclickで作成する時  <input type="button" value="クリック動作確認" onclick="alert('ボタンがクリックされました')"> これだけで実行されます。(headタグにscript記述なしで動作確認。) なぜ、<script>記述がなくても動くのでしょうか? onclick等のイベントハンドラに動作を記述する際は、そういう物だと覚えておいたほうがいいのでしょうか? ※当然関数をonclickに使用する際は、onclick=関数(); と記述し、headのscriptタグに関数を記述すれば動くというのは分かっているのですが・・・。 なぜ、 onclick="alert('ボタンがクリックされました')" の場合は、noscript無しで、動作するのかが分かりません・・・。 ・onclick 属性 = javascript という判断をどこかでされているのでしょうか? その結果、noscriptに記述がなくても動く? ちょっと気持ち悪いので質問させて頂きました。 ご教授お願いします。

  • FireFoxでJavaScriptのエラーが出ます。

    現在JavaScriptを独学しはじめた者ですが、ご回答の方よろしくお願いいたします。 右側のフレームに文字又は数字を入れてクリックすると左側のフレームに反映されると言うスクリプトです。 IEでは問題なく動作しますがFireFoxだと動作しません。 親フレーム <frameset cols="20%,*"> <frame src="left.html" name="left"> <frame src="right.html" name="right"> </frameset> 左側のフレーム <input type="text" name="answer"> 右側のフレーム <form> <input type="text" name="question"> <input type="button" value="click" onclick="parent.left.answer.value=this.form.question.value"> </form> アドバイスよろしくお願いいたします。

  • FireFoxでfocus()が上手く動かない

    javascriptを使って、 フォームのテキストエリアの入力文字数をチェックし、 オーバーしていれば、アラートを出し、テキストエリアにフォーカスを移動させる。 ようにしようとしています。 IEでは動いてのですが、FireFoxだと上手くフォーカスが移動してくれません。 どこがまずいのか、教えてください。 コード <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=euc-jp"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <script type="text/javascript"> <!-- function checkText(aText) { if (aText.value.length > 1) { alert('サイズオーバーです'); aText.focus(); } } //--> </script> </head> <body> <form method="post" action="#"> <input type="text" name="fmTitle" onBlur="checkText(this)"> <input type="text" name="dummy"> </form> </body> </html>

専門家に質問してみよう