• ベストアンサー

テキスト入力フォームの値を画面遷移なしで関数に渡す。

<form>によるテキスト入力フォームに入力されている値を、javascript関数に渡したいと思います。 ページ遷移させずに渡す方法はありますでしょうか? onclickで関数を呼び出しても、ページが再読込されてしまいます。 <a href="javascript:xxxxxx">で関数を呼び出して、ページ遷移なしで、値を渡すことはできました。 これと同様の効果を、テキスト入力フォームでも行いたいと思っています。 お分かりの方がいらっしゃいましたら、お教え願いたいと思います。 よろしくお願い致します。

質問者が選んだベストアンサー

  • ベストアンサー
  • yambejp
  • ベストアンサー率51% (3827/7415)
回答No.1

どのタイミングでわたしたいのかによります。 なにかボタンを押したときであれば以下のような感じで・・・ <form> <p> <input type="text" name="hoge"> <input type="button" value="hoge" onclick="alert(this.form.elements['hoge'].value)"> </p> </form>

yamaps
質問者

お礼

>yambejp様 今回も御回答ありがとうございます。 以前も回答頂きお世話になったことを記憶しております。 form.elementsで入力フォームの内容を取得できるというのは良いことを聞きました。 問題は解決しそうです。 ありがとうございました。

その他の回答 (1)

  • fujillin
  • ベストアンサー率61% (1594/2576)
回答No.2

>テキスト入力フォームでも行いたいと思っています テキストフィールドにonclickを設定すると大変使いにくくなります。(やってみればわかりますが) submitをキャンセルしたければ、false値を返せばキャンセルできます。 <html> <script language="JavaScript"> function hoge(el){alert("入力値=" + el.value);} function fuga(){ if (confirm("送信する?")) {return true;} else {return false;} } </script> <body > <form method="POST" action="xxx" onsubmit="return fuga()"> <input type="text" name="n1" onclick="hoge(this)"> <p> <input type="submit" value="送信" > <input type="reset" value="取消"> </form> </body> </html>

yamaps
質問者

お礼

>fujillin様 御回答ありがとうございました。 onsubmitでreturnを返せば送信されないことは初めて知りました。 ありがとうございます。 これでなんとか解決しそうです。

関連するQ&A