- ベストアンサー
XMLHttpRequest()で、読み込むテキストファイルにJavaScriptを記載する
お世話になります。 tst.htmlの内容 中略・・・・ <script type='text/javascript'><!-- ・・・・・・・・・・ var httpObj; httpObj = new XMLHttpRequest(); httpObj.open( "GET", 'tst.txt', true ); ・・・・・・・・・・ 中略・・・・ ・・・・・・・・・・ var txtObj=document.getElementById('DivText') txtObj.innerHTML = httpObj.responseText; ・・・・・・・・・・ 中略・・・・ ・・・・・・・・・・ funnction dsptst(){ documento.write('JavaScriptのあいうえお'); } //--> </script> <div id="DivText"></div> tst.txtの内容------------------------ 表示のテストあいうえお<br> <IMG src="abc.gif"> <script type='text/javascript'><!-- dsptst(); //--> </script> eof -------------------------------------- としますと、 <div id="DivText"> のエリアに 表示のテストあいうえお とか、 画像 abc.gif は、表示されます。 しかし、 「JavaScriptのあいうえお」 は、表示されません。 innerHTML で、テキストファイルを取得したときに それを表示するエリアに JavaScriptで、定義した関数の表示を行うにはどのようにしたらよいでしょうか。 なにとぞよろしくお願いいたします。
- rqg2010
- お礼率77% (283/364)
- JavaScript
- 回答数8
- ありがとう数8
- みんなの回答 （8）
- 専門家の回答
質問者が選んだベストアンサー
その他の回答 (7)
- BLUEPIXY
- ベストアンサー率50% (3003/5914)
Ｗｅｂサーバーにアップして試してますよね？
お礼
＞Ｗｅｂサーバーにアップして試してますよね？ 私の加入しているプロバイダのサーバにアップしてみました。「読込」ボタンが表示されるだけで、無反応でした。 また、作成し直した全てのスクリプトをアップしようと「お礼」「補足する」の双方を試みましたが文字数制限によりできませんでした。 そこで、新しい質問ならできるかと新スレッドを立てました。 しかし、同じく文字数制限となりました。新スレッドを立てた意味はなくなりましたが、 No.2234012 へ移行、ということで、このスレッドは閉じさせていただきます。 どうもありがとうございました。
- BLUEPIXY
- ベストアンサー率50% (3003/5914)
- BLUEPIXY
- ベストアンサー率50% (3003/5914)
#3補> ＞<script language="JavaScript"><!-- ＞JmpMenuInPage("100%"); ＞//--> ＞</script> の部分は、おそらく、document.write によって読み込まれる時にメニューを書き出しているのだと思いますが、 すでに述べたように、そういう方式は使えません。 ただ関数を実行すればいいのではなくて、実行される場所が肝心でもあるので、スクリプトを読んできて実行すればいいというものでもないです。 なので、JmpMenuInPage("100%") は、書き換える必要があります。 (後、関数から書き出せる場所も指定してやる必要があります） JmpMenuInPage の定義（中身）を補足していただけますか？
お礼
お早うございます。レスありがとうございます。 ＞JmpMenuInPage の定義（中身）を補足していただけますか？ function JmpMenuInPage(TblWdth){ document.write('<table width = "' + TblWdth +'" ><tbody><tr><td class="menu_jump13l">' +'<a href="#00top">▲<br>ページ<br>Topへ</a>' +'</td>' +'<td class="menu_jump13m">' ); var cnt = 0; loopFlg = true; document.write('| '); while (loopFlg) { document.write(JmpMenuInPage_Data[cnt]); document.write(' | '); loopFlg = (JmpMenuInPage_Data[++cnt] == undefined) ? false : true; } document.write('</td>' +'<td class="menu_jump13r">' +'<a href="#00btm">ページ<br>最終へ▼</a>' +'</td></tr></tbody></table>' +'<br>' ); var retCriteria='</td>' +'<td class="menu_jump13r">' +'<a href="#00btm">ページ<br>最終へ▼</a>' +'</td></tr></tbody></table>' +'<br>' } var JmpMenuInPage_Data = new Array( '<a href="#azumino_ryotei">D11</a>', '<a href="#azumino_schechi">D12</a>', '<a href="#azumino_photo">D13</a>' ); CSS td.menu_jump13 { font-size : 13px; text-align : center; width : 84%; height:30px; vertical-align : middle; } td.menu_jump13l { font-size : 13px; text-align : left; width : 8%; height:30px; vertical-align : middle; background-image : url(cork07.gif); } td.menu_jump13r { font-size : 13px; text-align : right; width : 8%; height:30px; vertical-align : middle; background-image : url(cork07.gif); } 配列の定義も以前教えていただいたようにフィールドにあたる項目をを定義してから、配列を定義すればスマートになると思いますが、ただ、羅列しただけとなっています。早く書き直したく思っているところです。 よろしくお願いいたします。
Ajax(XMLHttpRequest)のResponseTextの扱いは、SafariやOperaで文字化けしやすいので注意が必要です。 JavaScriptをAjaxで読み込む方法は、 httpObj.open( "GET", 'tst.txt', true ); としておき、Callback関数の中で、 var re = httpObj.responseText; eval(re); とするだけです。 その後は、reを使うのではなく、tst.txtの中にある変数や関数を使ってください。 Ajaxとして理解できなければ、まずは、 <script type="text/javascript" src="tst.js"><script> として読んだときに思うとおりに動くようなJavaScriptファイルを作成してみてはいかがでしょうか。 その後、ファイル名をtst.txtに変更し、Ajaxで動的に読み込むだけです。 もとのファイル名が.jsですから、その内容はどう書けばよいかわかりますよね？ （<script (略) src="tst.js"></script>で書くときの書き方がわからなかったら、改めて質問してください。） > ANo.2への補足 DIVを大量に作られていますが、（あまりおすすめはしませんがinnerHTMLで作られるなら） var div=document.createElement('DIV'); div.innerHTML=（新しい質問）; document.appendChild(div); としていくことで、divを動的に追加することが出来ます。 もちろんいちいちDIVを増やさなくても、既存のスペースを書き直すことも出来ます。 （質問のサンプル部分ですでにやっていらっしゃる方法です） 詳しい解説は、「DOM」解説サイトを回ってみてください。 Ajaxといいつつ、結局やることはDOMがメインですので、 AjaxやXMLHttpRequestに関するサイトを見られても、大して詳しくは書いてないです。 DOMを使わなくても出来なくはないですが、DOMを使われた方が出来ることも多いです。
お礼
貴重なレスありがとうございます。 txtObj.innerHTML = httpObj.responseText; とするところを var re = httpObj.responseText; eval(re); と、してみました。 responseText;で、読み込むテキストの内容を document.write('こんにちわ。<BR>'); document.write('<IMG src="../tripc/060325azumino/jonen_schech01.gif" width="200" alt=""><BR><BR>'); と、してみました。 おっしゃられるとおり、JavaScriptの内容が表示されました。 ありがとうございました。 でも、 こんにちわ。<BR> <IMG src="../tripc/060325azumino/jonen_schech01.gif" width="200" alt=""> は、そのまま、テキストファイルの内容として保存しておき、 その中に同等の文書として、 <script language="JavaScript"><!-- JmpMenuInPage("100%"); //--> </script> と、いう形で、書いて、 このJavaScriptのJmpMenuInPage("100%"); を実行したかったのですが。 とても参考になりました。 ありがとうございました。 これから、発展させても行けそうです。 更に、考えてみます。
- BLUEPIXY
- ベストアンサー率50% (3003/5914)
＃２の補足読ませていただきました。 （なんか、最近補足のメールがちゃんと届かない、古いのばかり何回も来る）返事が遅かったらすみません。 まどろっこしいと思われると思いますが、もう少し質問させて下さい。 menu 部分自体の共有化はできているんですよね。 外部スクリプトにして <script src="munu.js"></script> みたいにすればいいことですもんね。 それで、 動的に読み込む内容の 例えばDIV11 の中の内部メニュー部分をスクリプトでという話なのでしょうか そうではなくて DIV11 とDIV12の間にメニューを入れる？ DIV03 とDIV11の間にメニューを入れる？ まあ、それはそれとして、 動的に読み込まれるページに動的に読み込まれるメニューを付けるということですよね。 内容が動的に読み込んで表示できるなら、メニュー部分も動的に読み込んで表示できるように思うのですが、 その部分がスクリプト(document.writeで出力するような・）で構成されているというようなことですか？ できましたら、そのメニューを構成するスクリプト部分を補足していただけないでしょうか？ どちらにしても、メニューを書き出す領域（<div id="menu1"></div>みたいなの）が必要になるように思います。
補足
「お礼する」ですと、投稿できないようなので、「細くする」で、投稿させていただきます。 重ねてのレス誠にありがとうございます。 ＞まどろっこしいと思われると思いますが、もう少し質問させて下さい。 とんでもございません。こうして、レスを頂けるだけでとても励まされます。私の方こそ返信が遅れて申し訳ありません。 ＞menu 部分自体の共有化はできているんですよね。 外部スクリプトにして <script src="munu.js"></script> みたいにすればいいことですもんね。 そのようにしています。 ＞動的に読み込む内容の ＞例えばDIV11 の中の内部メニュー部分をスクリプト＞でという話なのでしょうか ＞そうではなくて ＞DIV11 とDIV12の間にメニューを入れる？ ＞DIV03 とDIV11の間にメニューを入れる？ DIV11 とDIV12の間にメニューを入れる と、いうことです。 DIV11～DIV1*は、説明上DIVで分けたようにしましたが、XMLHttpRequest()で、取得したテキスト文章を <div id="chang"></div> の中に一括表示したいものです。 そして、この一括表示した中に<div11>～<div15>があり、この間をjavascriptによるメニューで移動をさせたい。ところがjavascriptによるメニューが表示できない。 と、いうことでの質問です。 ＞できましたら、そのメニューを構成するスクリプト部分を補足していただけないでしょうか？ 以下が、*.txtとして読み込んで表示したい箇所です。 JmpMenuInPage("100%"); と、いうところが表示されないということの質問になります。 <div id="11> <IMG src="../art/art_titl21-120.gif" alt=""> <IMG src="../tripc/060325azumino/jonen_schech01.gif" width="200" alt=""> <BR>常念岳です。<BR> </div> <script language="JavaScript"><!-- JmpMenuInPage("100%"); //--> </script> <div id="12> ・・・・・・・・・・・ ・・・・・・・・・・・ </div> <script language="JavaScript"><!-- JmpMenuInPage("100%"); //--> </script> ・・・・・・・・・・・ ・・・・・・・・・・・ <div id="15> ・・・・・・・・・・・ ・・・・・・・・・・・ </div> もちろん、JmpMenuInPage("100%"); は、動作確認済みです。<div id="11"><div id="12"><div id="13">をジャンプします。 div id="11"～"15" の内容にあたる画像は表示されます。しかし、JmpMenuInPage("100%"); は、表示されません。 ご丁寧なレスに甘えての投稿で、恐れ入ります。 よろしくお願いいたします
- BLUEPIXY
- ベストアンサー率50% (3003/5914)
#1>具体的にどうやればよいかわかりません。 試しに、何かサンプルを作ってみてもいいんですけど、 「作ってくれたのはいいけど、私の用途には合わないな・」 なんてことも起こりがちなので、 具体的に、どのようなことがしたいのか教えてくれませんか？ 質問にあるような動作をさせる関数なら、別に分ける必要がないように思われます。
補足
重ね重ねのレスありがとうございます。恐れ入ります。 >試しに、何かサンプルを作ってみてもいいんですけど >具体的に、どのようなことがしたいのか教えてくれませんか？ お言葉に甘えまして。 +-------+--------------------------------+ | Menu | SubPage | | | | | | | +-------+--------------------------------+ |Div01 | | | +----------------------------------------+ |Div02 | | | +----------------------------------------+ |Div03 | | | +----------------------------------------+ |Div11 | | | +----------------------------------------+ |Div12 | | | +----------------------------------------+ |Div13 | | | +----------------------------------------+ |Div14 | | | +----------------------------------------+ |略 | +----------------------------------------+ |略 | |略 | +----------------------------------------+ |Div51 | | | +----------------------------------------+ | | +----------------------------------------+ |Div54 | | | +----------------------------------------+ と、いった具合のページを作成したく思っています。 ここで、div01～div54 を一つのページに読み込むと時間を要する。 そこで、div01～div03,div11～div14,・・div51～div54 を、別ページとして作成したい。 しかし、別ページとして作成すると、 その、全てのページにMENU、SubPageを配置する必要がある。 ここで、フレーム分割を考えたが、目的にそぐわない。 また、インラインフレームも考えたが、目的にそぐわない。 そぐわない理由は、必要なら記載させていただきますが、割愛させていただきます。 このようにページ分割をすると、 MENU、SubPageも毎回読み直さなければならなくなる。 また、 SubPageは、Div1*、Div2*、・・・Div5*は、関連が深いため、同一ページ内でのジャンプメニューを配置したい。 このようなことを考えていたときにAJaxに出会いました。 Menu、SubPageは、固定しておいて、 Div1～Div5、などを一つのファイルとして、読み込み 切り替えられる。これはすごい。 と、おもったのです。 しかし、 Div11と、Div12の間、また、Div13の 間などにページ内の同じジャンプメニューを配置するとき、同じメニューなので、JavaScriptで書こうと思いきや、それができませんでした。 それ故の質問です。 紹介していただいたJsonでならできるかと調べ始めたのですが、それも思うように理解できず行き詰まっていました。 そのとき、ありがたいレスを頂き、お言葉に甘えた次第です。 私の意図も、説明の舌足らず故、説明の未熟さ故、すぐに伝わりませんでしたら、その時には、付け加えて説明させていただきます。 なにとぞよろしくお願いいたします。
- BLUEPIXY
- ベストアンサー率50% (3003/5914)
実際に試してみたわけでの無いので参考までに読んで下さい。 まず、document.write についてですが、 document.write は、実行するタイミングが問題になることがあります。 Ｗｅｂページが読み込まれる段階でjavascript が実行されて、その一部としてdocument.write が実行される分には良いのですが、 一旦ページが作成した後実行すると、新しいページ（自動的のopen される）に書き込まれることになって、（書き込んだ内容以外）画面が真っ白ということになります。 というわけで、一旦ページの構成が終わった後で、DIV の中に動的にjavascript を差し込んで、動的にdocument.write を実行するようなことができたとしても、おそらく望むような動作にはなりません。 innerHTML で動的にＨＴＭＬを構成するのであれば、document.write を使わずに、innerHTML を使ってDIV の中身を書き出すような構成にするべきだと思います。 それは、それとして、 外部スクリプトして<script></script> の無い状態のファイルを テキストとして読み込んだとしたら、eval 関数でスクリプトの解釈実行をさせることができると思います。 場合によっては、ＪＳＯＮ形式で記述しておけば取扱がわかりやすいかもしれません。
お礼
レスありがとうございます。 ＞外部スクリプトして<script></script> の無い状態のファイルを ＞テキストとして読み込んだとしたら、eval 関数でスクリプトの解釈実行をさせることができると思います。 と、 ＞場合によっては、ＪＳＯＮ形式で記述しておけば取扱がわかりやすいかもしれません。 この二つができれば良いというように思うのですが、 具体的にどうやればよいかわかりません。 これから必死に調べます。 とりあえずは、お礼まで。
関連するQ&A
- innerHTMLで、関数での記載内容を希望のエリアに表示したい。
お世話になります。 下記のように行うと、 「実際は、いろいろと表示したい」 が、 「aaaaaaaaaaaaaaaaaa」 の下に表示されてしまいます。 また、 <div id="DspArea"> の位置には、undefined と、表示されてしまいます。 document.getElementById("DspArea").innerHTML="tst"; とすれば、 <div id="DspArea"> の位置に正確に表示されます。 innerHTMLで、関数で記載したタグを含む文字列を表示させるには何か気をつけなければならないことがあるのでしょうか。 よろしくご教示お願いします。 <script type="text/javascript"><!-- function dspTst(){ document.write('実際は、いろいろと表示したい'); } // --> </script> <div> <div id="DspArea"> </div> <div> aaaaaaaaaaaaaaaaaaaa </div> </div> <script type="text/javascript"><!-- document.getElementById("DspArea").innerHTML=dspTst(); // --> </script>
- ベストアンサー
- JavaScript
- XMLHttpRequest()で、読み込むテキストファイルにJavaScriptを記載する。続き
分割して、ULさせていただこうと思いましたが、文字数制限にかかりできませんでした。 概要 Ajax_blue.htmlとして、 ------------------------------------------- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="Content-Type" ・・・・・・・・・・・・・・・・ ・・・・・・・・・・・・・・・・ ・・・・・・・・・・・・・・・・ } //--> </script> </head> <body> <button type="button" onclick="Load()">読込</button> <div id="div1"></div> </body> </html> -------- jslb_ajax050_c.jsとして、 -------- //============ // SYSTEM : 暫定版クロスブラウザAjax用ライブラリ // PROGRAM : XMLHttpRequestによる送受信を行います // FILE NAME : jslb_ajaxXXX.js ・・・・・・・・・・・・・・・・・・・・・・・ ・・・・・・・・・・・・・・・・・・・・・・・ } return oj } -------------- div1.txtとして -------------- <div id="11"> <IMG src="../art/art_titl21-120.gif" alt=""> <IMG src="../tripc/060325azumino/jonen_schech01.gif" width="200" alt=""> <BR>常念岳です。<BR> ＤＩＶ１５ </div> --------- です。
- ベストアンサー
- JavaScript
- JavaScriptのinnerHTMLの挙動について
下で"JavaScript内からJavaScriptを書き出したいのですが"で質問したものですが，ソースコードを簡単にして再質問したいと思います． ソースは以下のようにし，divタグのところにinnerHTMLで文字"test"とJavaScriptでアラートを表示させるものです．表示してみたところ，"test"は表示されるのですが，アラートは出てきません． これはinnerHTMLではHTMLのタグは評価されるが，JavaScriptは評価されない，ということなんでしょうか．JavaScriptのこのような仕様は調べにくいので困っています．回答宜しくお願いします． <html><head><title></title> <SCRIPT type="text/javascript"> <!-- var str='<font color="blue">test</font><script type="text/javascript">alert(123);</script>'; function gogo(){ document.all("here").innerHTML = str; } //--> </SCRIPT> </head><body> <div id="here" style="position:absolute;width:600px;left:0px;top:0px;"></div> <SCRIPT type="text/javascript"> <!-- gogo(); //--> </SCRIPT></body></html>
- ベストアンサー
- JavaScript
- JavaScript メソッドの呼び出し方について
単純な質問で恐縮なのですが html内で、数か所、JavaScriptのInnerHTMLを使って表示させたい箇所があります。 <body> <div id="1"></div> <div id="2"></div> <body> たとえば、こうなっていたとして、idが1のところは、 JavaScriptのメソッド、Start(1)、2のところは、 Start(2)として、引数にIDを入れ、結果のInnerHTMLを 出力させたいです。 こんな感じでいけるんでしょうか？ <body> <script type="text/javascript"> Start(1); Start(2); </script> <div id="1"></div> <div id=""2"></div> </body> うまく動かず困っています。 Onloadとかトリガがあって指定する方法ならわかるのですが。 動かし方を教えていただけないでしょうか。 宜しくお願いします。
- ベストアンサー
- JavaScript
- JavaScriptのどこが間違いか教えてください。
JavaScript初心者です。 以下のJavaScriptの中に間違った記述はありますか？ ブログの更新情報をＨＰに載せるためのもので、 雑誌に書いてあったものを手打ちしたのですが、うまくいきません。 このJavaScriptのどこかに間違いがあると思っているのですが、 どなたかご指摘いただけませんでしょうか？ 他に必要な情報はありますかね？ <script type="text/javascript"> window.onload = function(){ //ロード画像の表示 $('rssbox').innerHTML = '<div style="text-align: center; margin: 50px 0"><img src="images/loadinfo.net.gif" width="24" height="24" alt="ロード中です" /></div>'; var url = "rss.php"; var http = new JKL.ParseXML(url); var output = '<ul>'; var func = function(data){ for(var i=0; i<=5; i++){ output += '<li><a href="' + data.rss.channel.item[i].link + '">' + data.rss.channel.item[i].title + '</a></li>'; } output += '</ul>'; $('rssbox').innerHTML = output; }; http.async(func); http.parse(); } </script>
- 締切済み
- JavaScript
- javascriptで困っています。教えてください
以下のようにjavascriptの内容を書いた外部のテキストファイルを読み込んで、実行しようとしているのですが、うまくいきません。普通にjavascriptを読み込むのは分かっているのですが、このような方法ができないのでしょうか？よろしくお願いします。 <!doctype html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>無題ドキュメント</title> </head> <body> <div id="jsbox"></div> <script type="text/javascript"> var jsbox = document.getElementById("jsbox"); //非同期通信///////////////////////////////////////////// var xmlHttp; loadText(); function loadText(){ if (window.XMLHttpRequest){ xmlHttp = new XMLHttpRequest(); }else{ if (window.ActiveXObject){ xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); }else{ xmlHttp = null; } } xmlHttp.onreadystatechange = checkStatus; xmlHttp.open("GET", "http://xxxxxxxxxxxx/js_test.txt", true); xmlHttp.send(null); } function checkStatus(){ if (xmlHttp.readyState == 4 && xmlHttp.status == 200){ var str = xmlHttp.responseText;alert(str); jsbox.innerHTML = str; test_js(); } } ///////////////////////////////////////////////////////////////// </script> </body> </html> テキストファイルをhttp://xxxxxxxxxxxx/js_test.txtに置き、テキストファイルの内容が <script type="text/javascript"> function test_js(){ alert("test"); } </script>
- 締切済み
- JavaScript
- javascriptで困っています
スマホでタッチした場所の座標を取得しようとしているのですが、いろいろ調べて以下のように作ってみましたが、座標が取得できません。どこを直せばいいのか、教えていただきたく投稿させていただきました。よろしくお願いします。 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"/> <meta name="viewport" content="width=320, user-scalable=no" /> <script type="text/javascript" charset="utf-8"> var touch_box = document.getElementById("box"); touch_box.addEventListener("touchstart", function(e){ document.getElementById("txt0").innerHTML = "スタート"; document.getElementById("txt1").innerHTML = e.pageX; document.getElementById("txt2").innerHTML = e.pageY; }, false); touch_box.addEventListener("touchmove", function(e){ document.getElementById("txt0").innerHTML = "ムーブ"; document.getElementById("txt1").innerHTML = e.pageX; document.getElementById("txt2").innerHTML = e.pageY; }, false); touch_box.addEventListener("touchend", function(e){ document.getElementById("txt0").innerHTML = "エンド"; document.getElementById("txt1").innerHTML = e.pageX; document.getElementById("txt2").innerHTML = e.pageY; }, false); </script> </head> <body> <div id="box"> <span id="txt0"></span><br /> X:<span id="txt1"></span>, Y:<span id="txt2"></span><br /> </div> </body> </html>
- ベストアンサー
- JavaScript
- 【javascript 文法】値渡し？参照渡し？
以下実行すると、AAAをクリックしてもBBBをクリックしても「BBB」とアラートされます。 <html> <head> <script type="text/javascript" src="prototype.js"></script> </head> <body> <script type="text/javascript"><!-- var gDown= false; var div = document.createElement('div'); div.id = 'AAA'; div.innerHTML = 'AAA'; document.body.appendChild(div); Event.observe(div, 'mousedown',function(){ gDown = div; }); var div = document.createElement('div'); div.id = 'BBB'; div.innerHTML = 'BBB'; document.body.appendChild(div); Event.observe(div, 'mousedown',function(){ gDown = div; }); Event.observe(document, 'mouseup',function(){ alert(gDown.id); gDown=false; }); //--></script> </body> </html> javascriptって値渡しだと思っていたので、期待した動作と異なります。参照渡しだと考えると納得できるのですが、javascriptって 参照渡し？それとも値渡し？ と混乱しています。 この辺のところを、教えてください。お願いいたします。
- ベストアンサー
- JavaScript
- javaScript Nullまたはオブジェクトではありません エラー
javaScriptは詳しくなく、サンプルプログラムを 参考にさせていただきながらテストをしています。 現在javaScriptで、タブ切り替えで表示内容を変更し、 表示されたフォームに、data.textの内容を表示するという テストをしています。 [コード] <html> <head> <meta http-equiv="content-type" content="text/html;charset=shift_jis"> <title></title> <script type="text/javascript"><!-- function loadTextFile() { httpObj = new ActiveXObject("Microsoft.XMLHTTP"); httpObj.onreadystatechange = statusCheck; httpObj.open("GET","data.txt",true); httpObj.send(null); } function statusCheck() { if ((httpObj.readyState == 4) && (httpObj.status == 200)) { displayData(); } } function displayData() { document.ajaxForm.result.value = httpObj.responseText; } // --></script> </head> <body> 省略(タブの切り替え設定) <div style="display:none" id="NAME11"> test1 </div> <div style="display:none" id="NAME22"> <form name="ajaxForm"> <input name="button" type="button" onClick="loadTextFile()" value="読み込み"> <textarea name="result" cols="40" rows="5"></textarea> </form> </div> <div style="display:none" id="NAME33"> test3 </div> </body> </html> ------------------------ 上記を実行すると "document.ajaxForm.resultは Nullまたはオブジェクトではありません" というエラーになってしまいます。 よろしくお願いします。
- 締切済み
- その他([技術者向] コンピューター)
- JavaScript オンマウスで画像切り替え、テキスト切り替え
javascriptで困っています。 あるテキストに一回のオンマウスで、 idを持った箇所の画像を切り替え、 また別のidをもった箇所にテキストを表示させたいのですがうまくいきません。 今までのコードはこちらです。 script -------------- function swap(n) { var items = [ { TextA:"あああ", ImageB:"../../common/logo.gif"}, { TextA:"２２２", ImageB:"../../common/logo.gif"}, { TextA:"３３３", ImageB:"../../common/logo.gif"} ]; var o = document.getElementById("Main"); $("Txt").innerText = items[n].TextA; $("Photo").src = items[n].ImageB; } html ---------- <div id="Main"> <img src="../logo.gif" alt="" name="Photo" width="120" height="60" id="Photo"> <div id="Txt" name="Txt">最初</div> </div> <A href="#" onmouseover="swap(0)">１</A><br> <A href="#" onmouseover="swap(1)">２</A><br> <A href="#" onmouseover="swap(2)">３</A> 詳しい方、どうぞご教授よろしくお願い致します。
- ベストアンサー
- JavaScript
お礼
ご丁寧にサンプルコードまで作成していただきありがとうございます。 嬉しさ余って早速試してみましたが、「読込」というボタンが表示されるだけで、そのボタンを押しても何の反応もありません。 取りあえず、嬉しさのあまり実行したことなので、間違っている箇所もあるかと思います。ゆっくりとソースを読ませていただきます。 実際に、どのようなファイルを作って試したかということも併せてお知らせしようとしたのですが、文字制限にかかりULできませんでした。 新しく質問の形で、その報告をさせていただきます。 新しい質問でも文字制限にかかった場合には、改めてご報告いたします。 どうもありがとうございました。