当サイトはアフィリエイト広告を利用してます
jQueryでフォームの値を取得する

フォームに入力されたデータを取得したいな。

jQueryを使うと便利よ。
jQueryを使う準備
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
jQueryを使うためには、jQueryをまず読み込む必要があります。行1を、htmlのhead部分に書き込みます。
上の例では外部リソースを直接参照していますが、手元にダウンロードしたものを読み込んでも構いません。
jQueryでフォームのデータを取得する
<input type="text" id="text1" value="abc" /> <input type="text" class="text2" value="def" /> <script> console.log($('#text1').val()); // abc console.log($('.text2').val()); // def </script>
jQueryを使うと、フォームのデータの取得が容易です。
フォーム項目のidが分かっていれば、$('#ID名')でその項目をピックアップし、.val()で値を取得できます。(行4)
フォーム項目のclassが分かっていれば、$('.class名')でその項目をピックアップし、.val()で値を取得できます。(行5)

訪問者が入力した値を取得したいな。

.change()というメソッドが用意されているわ。

ありがとう。jQuery使うと楽になるね。
値の変更時に処理する.change()
<input type="text" id="text3" value="" /> <script> $('#text3').change(function() { console.log( $('#text3').val() ); }); </script>
.change()を使うと、値の変更時に処理を実行できます。
$('#text3').change( ...(変更時の処理を書く)... );
が、id=text3の項目が変更されたときに、処理を実行する、という命令です。
function() { console.log( $('#text3').val() ); }
の部分が、実行される処理です。
更新日:

↑このページへのリンクです。コピペしてご利用ください。