- 締切済み
親ページのフォーム入力データを子ページのテーブルに書き込ませるには？
親ページ（フォーム入力ページ）から location.href で子ページ（確認ページ）を開くところまでは簡単なのですが、その次、親ページのフォーム入力データ（テキストフィールドのvalue、セレクトメニューのvalue、チェックボックスのvalue ）の特定のものを子ページのテーブルの特定のセルに書き込ませるにはどうしたらよいのかわかりません。 なにとぞお教えくださいませ。m(__)m 要は、企業のページに出てくる確認ページの真似をしたいのでアリマス。 当方、JavaScを始めて２ヶ月の準初心者です。やさしく解説してやってくださいませ。
- JavaScript
- 回答数1
- ありがとう数1
- みんなの回答 （1）
- 専門家の回答
みんなの回答
- arenani_sorenani
- ベストアンサー率73% (58/79)
POSTのデータをjavascriptでは受け取れません。 GETは可能ですが文字化けする場合があります。 なので、以下例ではスクリプトでエンコードして URL？以降に繋げてデータを渡してます。 以下をa.htmlとして保存 <html> <head> <meta http-equiv="content-type" content="text/html; charset=shift_jis"> <script> function check(){ var obj=document.forms[0]; if(obj.txt.value==""){ alert("名前を入力してください。"); }else{ str1="txt="+escape(obj.txt.value); str2="&slt="+escape(obj.slt.value); str3="&chk="; if(obj.chk[0].checked){str3+=escape(obj.chk[0].value);} if(obj.chk[1].checked){str3+=escape(","+obj.chk[1].value);} location.href="b.html?"+str1+str2+str3; } } </script> </head> <body> <form> 名 前： <input type="text" name="txt" value="" /><br><br> 年 齢： <select name="slt"> <option value="10歳以下">10歳以下 <option value="10歳以下">20歳以下 </select><br><br> ペット： <input type="checkbox" name="chk" value="犬" checked/>犬 <input type="checkbox" name="chk" value="猫" />猫<br><br> <input type="button" value="送信" onclick="check()"/> </form> </body> </html> 以下をb.htmlとして保存 <html> <head> <meta http-equiv="content-type" content="text/html; charset=shift_jis"> <script> function getkey(key,tmp1,tmp2,xx1,xx2,xx3){ tmp1=location.search.substring(1,location.search.length)+"&"; xx1=xx2=0; len=tmp1.length; while(xx1<len){ xx2=tmp1.indexOf("&",xx1); tmp2=tmp1.substring(xx1,xx2); xx3=tmp2.indexOf("="); if (tmp2.substring(0,xx3)==key){ return(unescape(tmp2.substring(xx3 + 1, xx2 - xx1))); } xx1=xx2+1; } return(""); } function start(){ txt=getkey("txt"); slt=getkey("slt"); chk=getkey("chk"); str="名 前："+txt+"<br>年 齢："+slt+"<br>ペット："+chk; text.innerHTML=str; } </script> </head> <body onload="start()"> <table> <tr> <td id="text"> </td> </tr> </table> </body> </html>
お礼
ご回答いただいたscriptを理解しようと悪戦苦闘しましたが、私のスキルと脳力では残念ながらかなわず、とりあえず幼稚なconfirmでやることにしました。 貴重なお時間を割いてご回答いただきましたのに、使わせていただくことができなかったことをお詫び申し上げます。m(_ _)m
補足
さっそくのご回答ありがとうございます。 私のスキルでは理解できないところがありますので、参考書と首っ引きで研究させていただきます。(゜-゜;