- 締切済み
データを送るのと値を渡すのを同時に行いたい
a hrefでデータを送るのと値を渡すのを同時に行いたいのですがどうすればいいのでしょうか。 下記のa hrefでのデータを送りに<a href="http://www.localhost/hoge.php?name=papa&age=30"> のような固定された値を受け渡したいのですがどのようにすてばいいのでしょうか <form name="form1" action="test" method="post"> <input type="hidden" name="str" value="aaa"> <A HREF="javaScript:form1.submit();">ここの書き方がわかりません</A> <form>
- basi999
- お礼率7% (78/993)
- JavaScript
- 回答数4
- ありがとう数1
- みんなの回答 （4）
- 専門家の回答
みんなの回答
- taseki
- ベストアンサー率66% (155/233)
> 一つ質問なのですが何故href="javascript:～" はあまり良くないのでしょうか教えて貰えないでしょうか 主な理由としては2つです。 ●HTMLなどWeb関係の仕様を決めている本家 W3C（http://www.w3.org/）が、あまり使わないように勧告しています。また、いずれ廃止される方向だそうです。その理由は、ユーザーがスクリプトを使っていない場合にブラウザがリンクを作ることが出来ないからです。 ●もう一つの理由はブラウザの挙動です。ご存知のようにA アンカータグは、主にクリックして「移動」するという動作をしますが、その移動先に（半ば強引に）スクリプトを割り当てたのがhref="javascript:～" です。 移動のときブラウザはページをリセットします。一番わかりやすい例としては、ページ内のGIFアニメーションなどがＡタグをクリックした瞬間に止まる、というのがあります。 ブラウザは「移動」だと思っているので、このようにページをリセットしますが、実際には移動しないでスクリプトを実行するだけですよね。 で、onclick="～" の最後に return false と書いてあるのに注目してください。これは、その挙動、つまり「Ａタグをクリックした」ということ自体をキャンセルしています。言い換えれば、必要なスクリプトを動かした後に、「クリックしていない」ことにしてしまうわけです。これで「移動」が起きません。 もちろん今回の例では大した影響はないと思いますが、基本的には上記を踏まえてonclickを使用したほうがいいです。
- taseki
- ベストアンサー率66% (155/233)
下のソース、一部を質問内容からコピーしましたが、一部のタグが間違ってますね。 正しくは以下のとおり（form閉じタグ）。 ----------------------------- <form name="form1" action="test" method="post"> <input type="hidden" name="str" value=""> </form> <a href="#" onclick="document.form1.str.value='data1';document.form1.submit();return false;">データ「data1」を送信します</a><br> <a href="#" onclick="document.form1.str.value='data2';document.form1.submit();return false;">データ「data2」を送信します</a><br> <a href="#" onclick="document.form1.str.value='data3';document.form1.submit();return false;">データ「data3」を送信します</a><br> -----------------------------
- taseki
- ベストアンサー率66% (155/233)
ご質問の「データを送る」と「値を渡す」は同じ意味と思われ、ちょっとご質問の意味がよく解らなかったのですが、以下のように推測しましたが良いでしょうか。 ●ページ上にフォームがあり、あるAタグをクリックすると、自動的にフォームに値を設定して送信する、というJavaScriptを作りたい。 上記でよければ、以下のような感じです。 ----------------------------- <form name="form1" action="test" method="post"> <input type="hidden" name="str" value=""> <form> <a href="#" onclick="document.form1.str.value='data1';document.form1.submit();return false;">データ「data1」を送信します</a><br> <a href="#" onclick="document.form1.str.value='data2';document.form1.submit();return false;">データ「data2」を送信します</a><br> <a href="#" onclick="document.form1.str.value='data3';document.form1.submit();return false;">データ「data3」を送信します</a><br> ----------------------------- ※href="javascript:～" はあまり良くない
何か参考になりますか↓？ ----------テキストエディタにコピペ＆保存------- <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis"> <title>検索窓の例</title> </head> <body> <p><a href="http://help.goo.ne.jp/door/001_a.html">goo検索窓</a></p> <p>上記ページにあるタグの無駄を省くと</p> <form action="http://search.goo.ne.jp/web.jsp" name="query1" target="goo"> <input type="text" name="MT" value="" size="20"> <input type="submit" value="検索" name="web"> <input type="hidden" name="IE" value="sjis"> </form> <p>ボタンを，文字に変えると</p> <form action="http://search.goo.ne.jp/web.jsp" name="query2" target="goo"> <input type="text" name="MT" value="" size="20"> <a href="javaScript:query2.submit();">検索</a> <input type="hidden" name="IE" value="sjis"> </form> <p>となります。</p> </body> </html> ---------------------------------------------
お礼
回答ありがとうございます。 一つ質問なのですが何故href="javascript:～" はあまり良くないのでしょうか教えて貰えないでしょうか