Search
  1. URLの?以降を取得〔searchプロパティ〕
  2. 他のページへ入力内容を渡す〔searchプロパティ使用〕

他のページへ入力内容を渡す
searchプロパティ使用

unknown

searchプロパティを使用して、送信先画面にパラメータから受取った情報をフォームに書き出す例です。 フォームの入力状態を送信先のフォームに確認用として表示するのに便利です。

オブジェクト名windowは省略可。

パラメータを渡す側

サンプルを見る
<script type="text/javascript">
    /* パラメータを渡す側 */
    function send() {
        var name="";
        var sex="";
        var favorite="";
        /* 名前(コード変換) */
        if (document.form1.name.value!=""){
            name=escape(document.form1.name.value);
        }
        /* 性別 */
        if(document.form1.sex[0].checked){
            sex=escape(document.form1.sex[0].value);
        }else if(document.form1.sex[1].checked){
            sex=escape(document.form1.sex[1].value);
        }
        /* 興味 */
        for(i=1;i<=4;i++){
            if(document.form1.elements["favorite"+i].checked){
                favorite+=document.form1.elements["favorite"+i].value+" ";
            }
        }
        favorite=escape(favorite);
        /* 取得した値をパラメータにセット(アンパサンド'&'で連結) */
        var pram="name="+name+"&sex="+sex+"&favorite="+favorite;
        /* アドレスにパラメータを付加 */
        location.href="/module/include/js/location4/test2.html?"+pram;
        return false;
    }
</script>

<!-- ★送信フォーム [start] -->
<form action="#" method="get" name="form1" onsubmit="return send();">
    <fieldset>
        <legend>パラメータに渡す値を入力</legend>
        <p>
            名前:<input type="text" name="name" value="" size="20" />
        </p>
        <p>
            性別:
            <input type="radio" name="sex" value="男">男
            <input type="radio" name="sex" value="女">女
        </p>
        <p>
            趣味:
            <input type="checkbox" name="favorite1" value="スポーツ" />スポーツ 
            <input type="checkbox" name="favorite2" value="映画鑑賞" />映画鑑賞 
            <input type="checkbox" name="favorite3" value="音楽鑑賞" />音楽鑑賞 
            <input type="checkbox" name="favorite4" value="仕事!" />仕事!
        </p>
        <p>
            <input type="submit" value="送信" />
        </p>
    </fieldset>
</form>
<!-- ★送信フォーム [end] // -->

パラメータを受取る側

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <meta http-equiv="Content-Script-Type" content="text/javascript">
        <title>PHP & JavaScript Room: test2.html</title>
        <script type="text/javascript">
            /* パラメータを受取る側 */
            function pramWrite() {
                /* アドレスの「?」以降の引数(パラメータ)を取得 */
                var pram=location.search;
                /* 引数がない時は処理しない */
                if (!pram) return false;
                /* 先頭の?をカット */
                pram=pram.substring(1);
                /* 「&」で引数を分割して配列に */
                var pair=pram.split("&");
                var i=temp="";
                var key=new Array();
                for (i=0; i < pair.length; i++) {
                    /* 配列の値を「=」で分割 */
                    temp=pair[i].split("=");
                    keyName=temp[0];
                    keyValue=temp[1];
                    /* キーと値の連想配列を生成 */
                    key[keyName]=keyValue;
                }
                var name=sex=favorite="";
                /* 名前 */
                 if (!key["name"] || key["name"]==""){
                    name="匿名希望";
                }else{
                    /* コード変換 */
                    name=unescape(key["name"]);
                }
                /* 性別 */
                
                 if(key["sex"]!="") {
                    sex=unescape(key["sex"]);
                }else{
                    sex="性別不明";
                }
                /* 興味 */
                if(key["favorite"]){
                    favorite=key["favorite"];
                }else{
                    favorite+="無趣味";
                }
                document.form1.pram.value="名前:"+name+"\n"+"性別:"+sex+"\n"+"趣味:"+unescape(favorite)+"\n";
            }
        </script>
    </head>
    <body onload="pramWrite()">
        <form name="form1" action="#">
            <fieldset>
                <legend>受け取ったパラメータを表示</legend>
                <textarea cols="40" rows="4" name="pram" style="border:0;overflow:visible" readonly="readonly"></textarea>
            </fieldset>
        </form>
    </body>
</html>

関連コンテンツ

Q. このサイトの情報はお役に立ちましたでしょうか?

投票する 投票結果を見る

管理人に【web拍手】を送るweb拍手(1行メッセージも送れます♪)

pagetop

polarized women