Question

我有一个简单的表格：

<form id="radio_form">
  <fieldset>
    <label><input type="radio" name="color" value="1" />Red</label><br />
    <label><input type="radio" name="color" value="2" />Yellow</label><br />    
    <label><input type="radio" name="color" value="3" />Blue</label><br />
    <label><input type="radio" name="color" value="4" />Purple</label><br />
  </fieldset>

   <fieldset>
    <label><input type="radio" name="time" value="6" />12</label><br />
    <label><input type="radio" name="time" value="7" />11</label><br />    
    <label><input type="radio" name="time" value="8" />10</label><br />
    <label><input type="radio" name="time" value="9" />9</label><br />
  </fieldset>
</form>

我试图将两个选定的值作为总和传递给.result，遗憾的是.result仅显示来自第一个输入[color]的值。如何从两者中获取结果：输入[颜色]和输入[时间]？

这是我的功能：

$(function(){
    var value = $('input:radio:checked').val();

    $('.result').html(value)


});

非常感谢您的帮助。

的Dom

Answer 1

与大多数jQuery的getter重载一样，val()仅返回第一个项的值。您可以使用 map（）并加入生成的数组：

$(function() {
    var value = $('input:radio:checked').map(function() {
        return this.value;
    }).get().join(" ");  // You could join with a comma if you like

    $('.result').text(value);  // Use text() unless you're adding HTML
});

啊，看来你是在追赶一个总计。在这种情况下，您需要 each（）：

$(function() {
    var value = 0;

    $('input:radio:checked').each(function() {
        value += +this.value;
    });

    $('.result').text(value);  // Use text() unless you're adding HTML
});

上面代码中的

+this.value将值强制转换为数字。

Answer 2

$(function(){
    $(".result").html(""); // clear result
    $("input:radio:checked").each(function() {
        $(".result").append($(this).val()); // append value of each matched selector
    });
});

使用jQuery将值传递给结果

2 个答案: