0

ラジオボタンを含むフォームがあります。これらの名前は、option1、option2、およびoption3です。これらのラジオボタンにはそれぞれ、3つの異なる潜在的な値があります。

フォームの下に現在「チェックされている」値を表示する必要があります。私はjqueryガイドに従っていて、非常に混乱しています。

<script>
function displayVals() {
  var opt1 = $('input:radio[name=option1]:checked').val() || [];
  var opt2 = $('input:radio[name=option2]:checked').val() || [];
  var opt3 = $('input:radio[name=option3]:checked').val() || [];
  $("p").html("First item is " + opt1.join(", ") + " the second is " + opt2.join(", ") + " and third is " + opt3.join(", ") + ".");
}

$("input").change(displayVals);
displayVals();

ただし、フォームの下には何も表示されません。たとえば、option1は、白、赤、または黒のいずれかになります。彼らが黒をチェックする場合、私は「最初のアイテムは黒で、2番目は何でも、3番目は何でも」と言う必要があります。フォームの下では、値の1つが変更されるたびに更新されます。

4

2 に答える 2

1

これは機能するはずです。これがフィドルjsfiddleです

function displayVals() {
  var opt1 = $('input:radio[name=option1]:checked').val() || '';
  var opt2 = $('input:radio[name=option2]:checked').val() || '';
  var opt3 = $('input:radio[name=option3]:checked').val() || '';
  $("p").html("First item is " + opt1 + ", the second is " + opt2 + ", and third is " + opt3 + ",.");
}

$("input:radio").click(displayVals);
displayVals();​
于 2012-09-22T13:03:44.793 に答える
0

val()文字列undefinedを返しますが、配列は返しません。だからこれは

function displayVals() {
    var opt1 = $('input:radio[name=option1]:checked').val() || 'not selected';
    var opt2 = $('input:radio[name=option2]:checked').val() || 'not selected';
    var opt3 = $('input:radio[name=option3]:checked').val() || 'not selected';

    $("p").html("First item is " + opt1 + " the second is " + opt2 + " and third is " + opt3 + ".");
}
于 2012-09-22T12:54:32.040 に答える