みんなの「教えて(疑問・質問)」にみんなで「答える」Q&Aコミュニティ

こんにちはゲストさん。会員登録(無料)して質問・回答してみよう!

解決済みの質問

Javascriptの中に外部jsファイルを呼び出したい。

入力フォームで都道府県などのたくさん項目がある
プルダウンメニューやセレクトボックスを外部化し

jsの中には
document.write('<option value="1">北海道</option>');
document.write('<option value="2">青森</option>');
document.write('<option value="3">岩手</option>');
document.write('<option value="4">宮城</option>');
などとし、ファイル名は「todou.js」としました。
セレクトボックスの外部ファイルは
document.write('<option value="1">インターネット</option>');
document.write('<option value="2">テレビ</option>');
document.write('<option value="3">新聞</option>');
などとし、外部ファイルは「kikkake.js」としました。
htmlのところには
<tr><td>都道府県:</td>
<td><select>
<script src="select1.js"type="text/javascript">
</script>
などとし、載せることはできました。
しかし、最後に送信ボタンを押した時に
確認するためにアラートで選択したものを出したい時に
どうやって呼び出したらよいのでしょうか?
色々調べてみたらまず
<script language="JavaScript" src"todou.js"></script>
とすると書いてありました。
しかし複数の外部ファイルを呼び出すためにはどうしたら
よいのでしょうか?
あとアラートで確認するために
function Check(){
var myTodou = document.myForm.src"todou.js".value;
alert('都道府県:' + myTodou);
とするのでしょうか?
不備部分がありましたらご指摘ください。
どうかよろしくお願いします。

投稿日時 - 2006-12-08 13:40:12

QNo.2587770

すぐに回答ほしいです

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

URLの先も見えないしアップされたものも見あたらないから
今までのやりとりで聞きたそうだと予測できる事を書いておくね

外部jsで書いても参照の仕方は同じ。
form内容を追加して書いてるなら同じ方法で取り出せる。
ただ、名前を付け忘れるとアウト
selectの内容を書き換える場合も値を参照するのと同じようにして代入で。

formのパーツの幾つかそのものを書き換えてその値が欲しいなら document.write では書き換えられない。
document.write は飽くまでも最初のHTML描画中にでないとならない。描画が終ってからの書き換えは主に innerHTML を使う。
書き換えた後は他と同じ方法で参照できる。


http://www.tohoho-web.com/js/form.htm

投稿日時 - 2006-12-10 16:48:36

お礼

どうも何回も丁寧な回答を頂きまして
ありがとうございました。

まだはっきり分かったわけではないのですが
一回ここで終了したいと思います。

もう一度これを参考にじっくり考えたいと思います。

アホな自分に最後までお付き合いしていただき
本当に感謝しています。
ありがとうございました。

投稿日時 - 2006-12-14 00:50:54

このQ&Aは役に立ちましたか?

0人が「このQ&Aが役に立った」と投票しています

回答(5)

ANo.4

やり取りをみていてもいまいちやりたいことがはっきりしないので
いくつか注意点を。

(1)jsの外部ファイルを使うのであれば基本的には
ユーザー関数化しておき、必要に応じて関数を呼び出すようにしてください
つまり

//a.js
function aFunc(){
document.write("hoge")
}

//test.htm
<html>
<head>
<script type="text/javascript" src="a.js">
</head>
<body>
・・・・
<script language=javascript>
aFunc()
</script>
・・・・
</body>
</html>

(2)送信時のチェックはformタグのonSubmitをつかってください
<form onSubmit="return check()">
<select>
<option>・・・・</option>
<option>・・・・</option>
<option>・・・・</option>
</select>
<input type="submit" value="送信">
</form>
※check関数は適当にあらかじめ書いておく。

この2点でだいぶ違ってくるとおもいます

投稿日時 - 2006-12-10 15:14:32

ANo.3

つまり変化したら呼出、とかそういうのをやりたいのかな
だとしたらHTML側にで onChange や onSubmit を使って呼ぶようにすれば良い

<form action="javascript:()">
 <!-- selectとか -->
 <input type="submit" onClick="Check()">
</form>

投稿日時 - 2006-12-09 01:38:56

お礼

日本語が下手ですいません。

http://antiasterisk.neconet.net:40080/up/index.html
のantiast3053.lzh(DLkey=0000)に作成途中のものをUP
しました。
送信ボタンを押すと記入したものが確認としてアラートで
でてきます。
テキストボックスなどはすぐにできたのですが
外部化したセレクトボックスなどは
できずに悩んでおります。
外部化したファイルは最初に書いた通りです。
私がやりたいことわかっていただけたでしょうか?
どうか宜しくお願いします。

投稿日時 - 2006-12-09 21:30:03

ANo.2

例として No1の書き方だとして
下の場合は分割する必要もfunctionにする必要も無いが分割の例という事で。

//----- a.js
x = [ "インターネット","テレビ","新聞" ]; //これはHTML描画の時に読まれる
function A_LIST(){ //これはHTML描画時点では実行されない
 for(i=0;i<x.length;i++){
  document.write("<option value=\""+i+"\">"+x[i]+"</option>");
 }
}

//----- b.js
A_LIST(); //a.js では実行されないがここで実行される

投稿日時 - 2006-12-08 18:01:44

お礼

ご回答くださってありがとうございます。
しかし何度やってもうまくいきません。

まず<script language="JavaScript" src="kikkake.js"></script>
をjavascriptの最初に置くと、kikkakeの内容が
画面にでてしまいます。
<HTML>
<HEAD>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<script language="JavaScript" src="kikkake.js"></script>
<--!
このようにしたのですがどうすればよいのでしょうか?

あとテキストボックスなど多数アラートで呼び出してるため
すべて同じfunctionにしております。
var myMail = document.myForm.userMail.value;
var myTell1 = document.myForm.telado1.value;
var myTell2 = document.myForm.telado2.value;
var myTell3 = document.myForm.telado3.value;
alert('\nメールアドレス:' + myMail + '\n電話番号:' + myTell1 +
'-' + myTell2 + '-' + myTell3 + '\n利用のきっかけ:' + myKikkake +'\n備考:' + myOpinion);
このようにしております。
ですのでこれにうまく表示できる方法はどうしたら
よいのでしょうか?

色々考えたのですがすべてうまくいかず頭が混乱しております。
どうかよろしくお願いします。

投稿日時 - 2006-12-08 23:21:00

ANo.1

>複数の
複数書けば良い

<script language="JavaScript" src="a.js"></script>
<script language="JavaScript" src="b.js"></script>
<script language="JavaScript" src="c.js"></script>
・・・

もしfunction呼出でなく直接実行でaやbでcの内容を使う場合はcを先に記述する事。aがb、bがc、cがaを呼ぶ、等とやっている場合は一旦使用の依存関係を整理し、場合によってはa,b,cの内容を統合・入れ替えするようにする。

投稿日時 - 2006-12-08 13:49:17

お礼

早速のご回答ありがとうございました。
とても勉強になりました。

あと呼び出し方はどのように書いたら
いいのでしょうか?

投稿日時 - 2006-12-08 16:41:14

あなたにオススメの質問