まず、HTMLの属性が不思議な感じになっています。
属性の値は"
で囲ったほうがようでしょう。そして、inputタグの値を入れる属性はval=値
ではなくvalue="値"
です。
属性が正しく指定されていればフォームを送信すると正確にデータが送信されているはずです。
html
1<input type="text" name="a" value="a">
2<input type="text" name="b" value="b">
3<input type="button" name="c" value="button">
まず、input[type="text"]
限定であれば、
jQueryのタグも付いておりますので、jQueryを使ってinput[type="text"]
で丸っと取得して.each()
で1つ1つループで回して値を取得してあげることができます。
どんなinput type=textが来ても
この部分が、textではなく、checkboxやradioなどの違うタイプが来てもと言う意味であれば、
$('input')
で丸っとインプットタグを取得してループで回して、その際に1つ1つのtype
で判別して、入力されている値の取得方法を変更して上げる必要があります。
以下、input[type="text"]
のみが沢山あるかも知れないけど、全部取得したい。と言う前提になります。
ボタンを押すと、フォーム送信されて、JavaScriptでtextボックスの中身をそれぞれとりたいです。
この部分の意図することがいまいち不明瞭なのですが、
0. ボタンをクリックする
0. フォームが送信される
0. 何らかの処理が行われた後でこのページに戻ってくる?
0. ページに戻ってきた後に送信した内容がinput[type="text"]タグのvalueに予め入力されている?
0. ここでinput[type="text"]タグのvalueをjavascriptで取得したい?
ということでしょうか?
上記のような想定であれば、フォーム送信後に戻ってくる時に予めvalueをセットするのに何かしらの言語を使用しているかと思いますので、その言語でフォームが送信された後の時だけ、出力されるブロックを作成し、そこにループで値を取得するjavascriptを記述すれば良いかと思います。
html
1<?php if( 'フォーム送信後' ): ?>
2<script>
3$(function() {
4 var data = {};
5 !function() {
6 $('input[type="text"]').each(function(i, elm) {
7 var $input = $(elm),
8 val = $input.val(), // inputタグのvalue
9 inputName = $input.attr('name'); // inputタグのname属性
10 data[inputName] = val;
11 });
12 }();
13 console.log(data);
14});
15</script>
16<?php endif: ?>
そうではなく、buttonクリック時(フォーム送信前)にバリデーションとかで現在入力されている値を取得したいと言うことであれば、buttonにclick
イベントをつけてデータを取得するようにすれば良いかと思います。
javascript
1$(function() {
2 var getInputTextValues = function() {
3 var data = {};
4 $('input[type="text"]').each(function(i, elm) {
5 var $input = $(elm),
6 val = $input.val(), // inputタグのvalue
7 inputName = $input.attr('name'); // inputタグのname属性
8 console.log(inputName, val);
9 data[inputName] = val;
10 });
11 return data;
12 };
13 $('input[type="button"]').on('click', function(evt) {
14 var data = getInputTextValues();
15 console.log(data);
16 // 取り急ぎフォームを送らないようにするのであれば下記を追加してください。
17 // evt.preventDefault(); evt.stopPropagation(); を使う方法もあります。
18 // 興味があれば調べてみてください。
19 return false;
20 });
21});
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。