jQueryによるformの値を取得する方法一覧

idで取る

$('#input-id').val();

最も早く最も確実。

属性セレクターで取る

$('input[name=sample_input]').val();

classで取るより早く信頼性も高い。

radioの取り方

$('input[name=sample_radio]:checked').val();

フォームフィルタという概念。
:disabled, :enabled, :checked, :selectedが使えます。

checkboxの取り方

$('input[name=sample_checkbox]:checked').val();

で取れるが、チェックボックスは複数の場合があるので以下のようにする。

$('input[name=sample_checkbox]:checked').each(function(){
    console.log( $(this).val() );
});

以下ならtrue|falseで取れる。

console.log( $('#sample_checkbox_1').is(':checked') );//true or false

select(単一)の取り方

$('select[name=sample_selectbox]').val();

なんと値を取るだけ。

値ではなく文字列がほしい場合は以下でOK。

$('select[name=sample_selectbox] option:selected').text();

select(multiple)の取り方

var sample_selectbox = $('select[name=sample_selectbox]').val();
console.log(sample_selectbox);// =>[A, B]

単一のときと同じ。
しかしこちらは値が必ず配列で返る点に注意。

あわせて読みたい

コメントを残す