<form method="post" id="form" action="https://example.com/hoge.cgi"> <input type="hidden" name="foo" id="foo" value="abc" /> <input type="hidden" name="bar" id="bar" value="123" /> <input type="hidden" name="page" id="page" value="baz" /> <input type="submit" value="" /> </form> ```上記のformを送信するとパラメータが付与されてhttps://example.com/hoge.cgiに飛びますが、 スマートフォンのchromeでform送信後のページを開いたままブラウザを一度終了させ、 再びブラウザを起動させるとパラメータが反映されていないhttps://example.com/hoge.cgiが表示されてしまいます。 (safariの場合にはフォーム内容を再送信するかどうか聞いてきます) そこでformの内容をlocalstorageに保存し、再読み込み時(ブラウザを一度終了させ再び起動した場合)に keyとvalueを使い再びPOST送信してページを表示させたいと思っています。 POST送信するURLは https://example.com/hoge.cgi?foo=abc&bar=123&page=baz です。 onloadでkeyとvalueを呼び出し送信させることで可能になるようなのですが、 肝心のjavascriptをどのように記述すればよいのかわかりません。 formの内容は以下の方法でローカルストレージに保存できています。 ```ここに言語を入力 $('#form').submit(function() { var param = $(this).serializeArray(); $.each(param, function(index,elem){ localStorage.setItem(elem.name,elem.value); }); }); ```localstorageには以下のkeyとvalueが保存されています。 foo abc bar 123 page baz ご教授お願いいたします。 ----- 追記 ----- データベースのようなCGIを使っており、データファイル(data.cgi)からformで送信した内容に合致するデータを表示しています。 データのカテゴリがname、保存データがvalueとなっています。 form method="get"にするとmts10806さんの仰る通りデータも問題なく抽出でき、 またブラウザを再度開いてリロードしてもURLにパラメータが付与されているので問題なくデータが抽出されたページが開きます。 ただ、できればURLにはパラメータ(https://example.com/hoge.cgi?foo=abc&bar=123&page=baz)を付与させたくなく パラメータを付与(URLに表示)せずに(https://example.com/hoge.cgiで)読み込めないかと思っております。
記載のjavascript(おそらく以前私が提示したもの)ではHTMLにid=formの要素がないのでそもそもsubmitを感知できないように思います。
昨日はご回答ありがとうございました。とても助かりました。質問のHTMLにid="form"を記述し忘れていました。申し訳ありません。教えていただいたjavascriptでsubmitするとformの値が取得できています。
POST送信にGETのクエリストリングを入れる理由を明記された方が良いと思います。正直なところこれだけだとformのmethod=getにするだけで解決します。
分かりにくい説明で申し訳ありません。質問文に追記いたしましたのでご確認宜しくお願い致します。
回答3件
あなたの回答
tips
プレビュー