他のページへ情報を渡す

■Q&A

■Question

入力内容の取得・・・ 2003.4.1.Tue No.1612

こんにちは！ 初心者の身です・・・

a.html において、

<form action="Request2.html" method="post" ID="request2">
_MCUID<input type="text" name="_MCUID" ID="_MCUID"><br>
<input type="submit" name="post2" value="post2" ID="post2">
</form>

というフォームをつくりました。
これを submit すると、b.html に移動するのですが、b.html には、a.html のフォームに任意に入力した内容がそのまま表示されるようにしたいのです・・・（alertではなくて）

b.html内で

<SCRIPT Language="JavaScript">
<!--
document.write(　　);
// -->
</SCRIPT>

とするらしいということは分かったのですが、カッコの中に何と入れたらいいのかがわかりません・・・

それとも、上記のソース自体、まちがってるのでしょうか？
全然足りないのでしょうか？
初心者の質問で申し訳ありませんが、よろしくおねがいします。

■Answer

Re: 入力内容の取得・・・ ぴろあき 2003.4.2.Wed No.1616

「フォーム」はもともとCGIのために作られたので、JavaScript では扱い方がまったく異なります。CGIではフォームの内容を受け取る方法がHTMLの仕様レベルで用意されていますが、JavaScript にはありません。

かといって不可能なわけでもなく、CGIで言うところの「GETメソッド」を使うことができます。掲示板や検索サイトで見るような、URLの尻に付いてる?以降の不可思議文字列ですね。他にも cookie を併用するなどすれば、POSTメソッドの代替にならないこともないでしょう。

CGIと違うのは、URLの尻に付与される引数を自分で加工しないといけないとこでしょうか。（これが面倒くさいです）
一応、本物のGETメソッドも使えるのですが、文字コードの関係で日本語が入ると難しいです。

これを使うには indexOf() や substring() あるいは split() などを使って、文字列を加工できるスキルが必要です。目安としては「cookieを扱える」くらいでしょうか。
とりあえず簡単なサンプルをさくっと作ってみたんで、感じだけでも。

■実行結果

名前：

性別：男 女

興味：車 映画 音楽 JavaScript

（JavaScript しか使ってないので、送信してもサーバーはなにも処理しません）

■スクリプトの概要

流れとしてはこんな感じです。

  1. 送信ボタンを押した時に onsubmit で関数を実行
  2. フォームの値を取得し、引数を作る
  3. 作った引数を send.html? 以降に付加して JavaScript でジャンプ
  4. フォームには false を返して送信をキャンセル（つまり action は不使用）
  5. send.html では location.search を使って引数を取得
  6. 引数を元にフォームの状態を再現

詳細はソースをご覧ください。

■このスクリプトの対応ブラウザ

ほぼすべて
よほど古いブラウザでもない限り動くでしょう。
Netscape3
submit を使うとスクリプトで作った引数が無視されるので実行しません。しかし、Netscape3 より JavaScript オフの方が遥かに多いので、対応させるだけ労力の無駄遣いかも。
IE3
このサンプルは split を使ってるので実行しません。IE3なんてすでに絶滅状態にあるので、これまた報われない労力かも。

■ このページについて

このページは、質疑応答掲示板で使用した回答の残骸です。検索エンジンに捕まったりリサイクルしたりすることもあろうので、なんとなく残してあります。広く公開しているページではありませんが、第3者の閲覧を禁止するものでもありません。
恒久的なURIは保証できないものの、よほどのことがない限り削除されることはないでしょう。心配性な人はページの保存をおすすめします。（IEは mht 形式でないと保存できないかも）