• 締切済み

外部ファイルにするとテキストが書き込めない

こんにちは、javascript初心者です。 HTMLのtextarea内のテキストを変えたいのですが、HTMLにJSを埋め込むと動作するのですが、外部JSファイル読み込みだとなぜか何も表示されません。 なぜでしょうか。原因のわかる方、説明をどうかよろしくお願い致します。 ●HTML <head> <script src="test.js" type="text/javascript"></script> </head> <body> <form name="form1"> <textarea name="message" id="msg" rows="5" cols ="50"></textarea> </form> </body> ●JS window.onload = message(); function message(){ alert("hello");              //←これはちゃんと動作します。 document.getElementById("msg").value="hello"; //← 動作せず。 document.form1.message.value="hello"; //← これも上と同じく片方ずつ試しましたが、ダメでした。 }

みんなの回答

回答No.2

一番簡単な方法: ↓これをbody閉じタグの上に移動して <script src="test.js" type="text/javascript"></script> ↓jsの中身を変更する function message(){ alert("hello");              //←これはちゃんと動作します。 document.getElementById("msg").value="hello"; //← 動作せず。 document.form1.message.value="hello"; //← これも上と同じく片方ずつ試しましたが、ダメでした。 } message(); //←実行するだけ で動くようになりますよ。 <head>で読み込む外部JSでwindow.onloadすると 大抵DOMの準備が終わる前に実行されるので、「#msgなんてtextareaは存在しない」というエラーが出ていると思います。 なのでbodyの中(一番最後)にファイルの読み込みと関数の実行を入れるか、 Loadの代わりにDOMContentLoadedを使ってdocument.readyStateをチェックするのがよく使われます。

  • luka3
  • ベストアンサー率74% (296/398)
回答No.1

≫window.onload = message(); window.onload = message; が正しいと思うのですが、HTMLに直接書くとうまくいくという理由がはっきりしませんね。 処理の順番により、外部の時はdocumentの準備ができていない、といったところでしょうか。 別な書き方としては、 window.onload = function(){message();} とか。

関連するQ&A

  • テキストボックスにスクロールする文字列を表示する。

    テキストボックスにスクロールする文字列を表示する方法を知りました。^^ これはできたのですが、同じページで、「★メッセージ1」の他に 「別の表示」をさせたいのですがどうしたらいいんでしょうか? 例えば、「★メッセージ2」。など  <HTML> <HEAD> <TITLE></TITLE> <SCRIPT language="JavaScript"> <!-- msg="★メッセージ1     "; function scroll(){ msg=msg.substring(1,msg.length)+msg.substring(0,1); document.myform.mytext.value=msg; setTimeout("scroll()",300); } //--> </SCRIPT> </HEAD> <BODY onLoad="scroll()"> <CENTER> <FORM name="myform"> <INPUT name="mytext" size="20"> </FORM> </CENTER> </BODY> </HTML>

  • ロード時に外部ファイル読込

    お世話になっております。 onload時に外部ファイルのJavaScriptを呼び出したいのですがうまく動作しないので、 ここをお借りしてご質問させていただきます。 長いソースを抜粋しています。 【HTML】 <HTML> <HEAD> <script type="text/javascript" src="java.js"></script> </HEAD> <BODY onload="Check(Document.myFORM)"> <FORM name="myFORM">   <input name="ATEXT" type="text"> </FORM> </BODY> </HTML> 【java.js】 function Check(oj){  oj.ATEXT.disabled = true;  oj.ATEXT.style.backgroundColor = "#999999"; } 実際はテキストボックスがたくさんあり、HTML内に書くと ごちゃごちゃしてしまうため外部ファイルに記述しています。 しかし、動作させてみると「Documentは宣言されていません」というエラーが発生してしまいます; どうかご教授お願いいたします。

  • 外部ファイルを読み込めない

    初めまして。いつも質問やその回答を読ませていただいて、参考にさせていただいてます。 javascriptで作った超簡単なプログラムが動かないんです。 どなたか、助けてください。(>_<) 以下、test.htmlとtest.jsを作って、試して見ているのですが、動かない理由が分からず苦しんでいます。 =============test.html============= <html> <head> <script type="text/javascript" language="javascript" src="./test.js" ></script> </head> <body> <table> <form name="form2" method="post" onSubmit="return check()"> <tr><td><input type="text" name="names" size="50"></td></tr> <tr><td><input type="submit" name="submit" value="予約"></td></tr> </form> </table> </body> </html> =============test.html============= =============test.js============= function check(){ names=document.form2.names; if(names.value == ""){ alert("お名前を入力してください。"); names.focus(); return false; } else return true; } =============test.js============= どちらも、同じディレクトリに入れています。safari、ieでも×です。 どなたか、教えていただけませんでしょうか。

  • テキストエリア内で改行するには。

    次のスクリプトを実行すると、テキストエリア内に 01234560 と数字が表示されますが、これを 0 1 2 . というように改行も含めてテキストエリアに出力するにはどうすればよいでしょうか。 ¥nという文字を使用するのでしょうか? <html> <head> <script language="JavaScript"> <!-- var textA="" function my1() {for (i=0;i<11;i++){textA=textA+new String(i)} document.form1.text1.value=textA;} //--> </script> </head> <body> <form name="form1"> <textarea name="text1" size="10"></textarea> <input type="button" value="CLICK!" onClick="my1();"> </form> </body> </html>

  • TEXTAREA内の改行位置をinnerHTMLで反映させたい

    例えば、 <HTML> <HEAD> <SCRIPT> function send(){ var message = f1.message.value var str = '<HTML>\n<HEAD>\n</HEAD>\n<BODY>\n' str += ''+ message +'\n' str += '</BODY>\n</HTML>' document.frame1.document.body.document.body.innerHTML = str } </SCRIPT> </HEAD> <BODY> <FORM name="f1"> <TEXTAREA rows="10" cols="40" name="message" onChange="send()"></TEXTAREA> </FORM> <IFRAME name="frame1" id="frame1" width="90%" height="350"></IFRAME> </BODY> </HTML> このような記述をして、テキストエリア内に文字を数行にわたって書き込んでも改行はされません。 どのようにすれば改行されるようになりますか? innerHTMLのところをinnerTEXTとして改行位置に<BR>タグが入るようにするのでもかまわないのですが、、、 どなたかお分かりになる方、ご教授願います。

  • 外部JavaScriptファイルを読み込む

    <HEAD> <SCRIPT LANGUAGE="JavaScript"> <!-- function textReset(){ this.form1.userName.value=""; this.form1.passWord.value=""; } //--> </SCRIPT> </HEAD> のJavaScriptファイルを外出しにして、 <HEAD> <SCRIPT LANGUAGE="JavaScript" SRC="/jsp/script.js"></SCRIPT> </HEAD> という風に呼び出そうとしているのですが、うまくいきません。どこに問題があると考えられるのでしょうか?

  • JavaScriptからPerlへデータを送る方法について

    プログラミング初心者です。 HTMLで書いたフォームの中にあるテキストエリアのデータを、JavaScriptでデータを取り出して、それをPerlで受け取りたいのですが、方法に見当がつきません。 以下は書いてみたソースコードです。 HTMLファイル <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Form Test</title> <script type="text/javascript" src="JS/sample.js"></script> </head> <body> <form name=form1> <textarea name="comment" rows="3" cols="30">文字の入力</textarea> <input type="button" value="ボタン" onClick="Button()"> </form> </body> </html> JavaScriptファイル function Button(){ var comment = document.form1.comment.value; alert(comment); //値がとれてるか確認したかっただけです } Perlに関しては、#!/usr/bin/perl ぐらいしか、まだ分かりません。 よろしければ、JavaScriptからのデータ送信、Perlでのデータ受け取り方法を教えていただけないでしょうか。この質問に対して有効なサイトがあれば合わせて教えていただきたくおもいます。 よろしくお願いします。

  • ロード時に外部ファイル読込(2)

    先ほど質問させていただいた者です。再度お借りいたします。 http://oshiete1.goo.ne.jp/kotaeru.php3?q=2100998 画面ロード時に、ラジオボタンのValueによって テキストボックスの背景色等を変える処理です。 本ソースにいざ反映させてみると、正常に動作しませんでした; 注意ポップアップは出ないのですが、指定したとおりに背景色等が変わらない状態です。 下記ソースで修正点ございましたらご教授ください。 【HTML】 <HTML> <HEAD> <script type="text/javascript" src="java.js"></script> </HEAD> <BODY onload="Check(document.myFORM)"> <FORM name="myFORM">   <input type="radio" name="class" value="1" checked>その1   <input type="radio" name="class" value="2">その2   <input name="ATEXT" type="text"> </FORM> </BODY> </HTML> 【java.js】 function Check(oj){   switch (oj.class.value) {     case 1:      oj.ATEXT.disabled = true;      oj.ATEXT.style.backgroundColor = "#999999";      braek;     case 2:      oj.ATEXT.disabled = false;      oj.ATEXT.style.backgroundColor = "#FFFFFF";      braek;     default:      braek;   } } お手数ですが、よろしくお願いいたします。

  • OPTION の値をテキストエリアに

    こんにちは。 すみませんが教えてください。 下記の様に作っています。 テキストエリア(note1)に、OPTIONのS・M・Lというように表示させたいのですが、1・2・3というようになってしまったり、エラーがでてしまいます。 どのように変えたらよろしいでしょうか? ”サイズ”+####の所を何回か書き直して見ましたが上手くいきません。 私が何をしたいかというと、 確認ボタンを押したら表記されている文字や数字をテキストエリアに書きたいのです。 よろしくお願いします。 <HTML> <HEAD> <TITLE></TITLE> <SCRIPT Language="JavaScript"> <!-- A = new Array("\0","\ 1,000","\ 1,200","\ 1,500"); function Fa(x) { document.FM.TE.value = A[x]; } function ctotal() { var totalp=0; var disp1=document.FM.TE.value+" 円 "+" サイズ "+####### ; if(document.FM.TE.value>0) { totalp=parselt(totalp)+parselnt(document.FM.TE.value); } document.form03.note1.value=disp1; } //--> </SCRIPT> </HEAD> <BODY> <FORM name="FM"> <TABLE BORDER="3"><TR><TD> <SELECT name="OP" onChange="Fa(this.selectedIndex);"> <OPTION value="0" selected>0</OPTION> <OPTION value="1">S</OPTION> <OPTION value="2">M</OPTION> <OPTION value="3">L</OPTION> </SELECT></TD><TD> <INPUT size="8" type="text" name="TE" value="0"></TD></TABLE></FORM> <FORM NAME="form03"> <INPUT TYPE="BUTTON"VALUE="確認" onclick="ctotal()"> <TEXTAREA NAME=note1 ROWS=5 COLS=30></TEXTAREA></FORM>     </BODY> </HTML>

  • 外部JSファイルの書き方で・・・

    午後にも同じ質問をしたのですが、 http://oshiete1.goo.ne.jp/kotaeru.php3?q=1933867 訂正がありましたので、質問し直します。すみません。 外部JSファイルを作りましたが、なにも返してきません。 リンクにマウスが乗るとガイドメッセージが出るスクリプトと、雪が降るスクリプトを同じページに書いたのですが、ガイドメッセージには何の反応もなく、雪のほうはちゃんと動いていたので、てっきり呼び出しはできていると思い込んでいたのですが・・・ 雪のほうの外部ファイルのスクリプトを試しに削除してみたら、まだ動いていました・・・ なくても動くらしかったです。 外部ファイルの書き方を説明されているサイトさんから、簡単なスクリプトをお借りしてコピペしましたが、私がやるとどうしても動かないです。 ちなみに、スクリプトはこんなふうに書いています。 //<!-- 外部ファイル内--> function a() { alert("Oh!"); } <!-- HTML内 --> <head> <script type="text/javascript" src="フォルダ名/ファイル名.js"></script> </head> <body> <form> <input type="button" value="click" onClick="a()"> </form> </BODY> 私のファイルではウンともスンともいいません。 なぜだか見当もつきません。 どなたかお助けください・・・

専門家に質問してみよう