Javascript 在jQuery函数中切换输入非常量的选中状态

我担心我遗漏了一些非常明显的东西，但是这个jquery函数似乎工作不一致

HTML:

按钮用于替换收音机输入的交互作用。在第一次单击每个按钮时，它会按预期工作，但随后的任何单击都会返回未定义（并从输入中完全删除选中状态）

使调试变得特别棘手的是，当我检查

DOM

时，一切都按预期进行。radios checked status/attr确实发生了变化，但jquery仍将其报告为未定义，并且从视觉上看，单选按钮未被选中（如果您在JSFIDLE上检查结果，并在单击按钮时观察输入，则可以看到这一点）

有什么想法吗？

您可以使用以下方法：

$（文档）.ready（函数（）{
$（'button'）。在（'click'）上，函数（e）{
e、 预防默认值（）；
var option=$（this）.parent（'.right'）.parent（'label'）.attr（'id'）；
var值=$（this.data（'value'）；
//$（'#'+选项）.find（'input[type=radio]'）。removeAttr（'checked'）；
//将此处attr替换为prop
$（'#'+option+'输入[value='+value+']'）.prop（'checked'，true）；
var收入本税年度=$（“输入[名称=收入本税年度]：选中”）.val（）；
console.log（本纳税年度的收入）；
})
});

您在纳税年度是否有自营职业、自营贸易或CIS收入

对
不
您可以改为使用：


$（文档）.ready（函数（）{
$（'button'）。在（'click'）上，函数（e）{
e、 预防默认值（）；
var option=$（this）.parent（'.right'）.parent（'label'）.attr（'id'）；
var值=$（this.data（'value'）；
//$（'#'+选项）.find（'input[type=radio]'）。removeAttr（'checked'）；
//将此处attr替换为prop
$（'#'+option+'输入[value='+value+']'）.prop（'checked'，true）；
var收入本税年度=$（“输入[名称=收入本税年度]：选中”）.val（）；
console.log（本纳税年度的收入）；
})
});

您在纳税年度是否有自营职业、自营贸易或CIS收入

对
不
使用而不是
attr（）
和
removeAttr（）
来更改
单选按钮的
选中状态

查看更多信息



$（文档）.ready（函数（）{
$（'button'）。在（'click'）上，函数（e）{
e、 预防默认值（）；
var option=$（this）.parent（'.right'）.parent（'label'）.attr（'id'）；
var值=$（this.data（'value'）；
$（'#'+option+'输入[value='+value+']'）.prop（'checked'，true）；
var收入本税年度=$（“输入[名称=收入本税年度]：选中”）.val（）；
console.log（本纳税年度的收入）；
});
});

您在纳税年度是否有自营职业、自营贸易或CIS收入

对
不
使用而不是
attr（）
和
removeAttr（）
来更改
单选按钮的
选中状态

查看更多信息



$（文档）.ready（函数（）{
$（'button'）。在（'click'）上，函数（e）{
e、 预防默认值（）；
var option=$（this）.parent（'.right'）.parent（'label'）.attr（'id'）；
var值=$（this.data（'value'）；
$（'#'+option+'输入[value='+value+']'）.prop（'checked'，true）；
var收入本税年度=$（“输入[名称=收入本税年度]：选中”）.val（）；
console.log（本纳税年度的收入）；
});
});

您在纳税年度是否有自营职业、自营贸易或CIS收入

对
不
寻求调试帮助的问题（“为什么此代码不起作用？”）必须包括所需的行为、特定的问题或错误以及在问题本身中重现这些问题所需的最短代码。没有明确问题陈述的问题对其他读者没有用处。嗨@Pete，对不起，什么不清楚？期望行为：“按钮用于替换收音机输入的交互作用”。JSFIDLE中包含可复制的代码。@Nathanhorn通过链接到JSFIDLE是不够的。请在问题本身的主体中包含相关代码（例如jQuery、HTML），这样即使JSFIDLE链接不起作用，问题仍然有用。事实上，我很惊讶你居然能发布这个问题，以前有一些检查来防止这种情况发生（哦，等等，你把DOM这个词变成了一个内联代码块来绕过它）。我必须承认我只是讨厌把代码变成内联代码，所以-我现在就把它复制过来-实际上没有任何理由投票赞成关闭，尽管这是一个简单的编辑。@AnthonyGrist“哦，等等，你把DOM这个词变成了一个内联代码块来绕过它”0.哦，伙计，你需要检查一下你的妄想症！寻求调试帮助的问题（“为什么这段代码不起作用？”）必须包括所需的行为、特定的问题或错误以及在问题本身中重现问题所需的最短代码。没有明确问题说明的问题对其他读者没有用处。嗨@Pete，对不起，什么不清楚？所需的行为：“按钮用于替换无线电输入的交互作用“。JSFIDLE中包含可复制的代码。@仅通过链接到JSFIDLE是不够的。请在问题本身的主体中包含相关代码（例如jQuery、HTML），这样即使JSFIDLE链接不起作用，问题仍然有用。事实上，我很惊讶你居然能发布这个问题，以前有一些检查来防止这种情况发生（哦，等等，你把DOM这个词变成了一个内联代码块来绕过它）。我必须承认我只是讨厌把代码变成内联代码，所以-我现在就把它复制过来-实际上没有任何理由投票赞成关闭，尽管这是一个简单的编辑。@AnthonyGrist“哦，等等，你把DOM这个词变成了一个内联代码块来绕开它”0.哦，哥们，你需要控制住那种妄想症！干杯！
<label id="income_this_tax_year">
  <div class="left">
    <p>Have you had Self-Employment, Sole Trade or CIS income during the tax year?</p>
  </div>
  <div class="right">
    <input type="radio" name="income_this_tax_year" value="yes" />
    <input type="radio" name="income_this_tax_year" value="no" />
    <button type="button" data-value="yes" class="button">Yes</button>
    <button type="button" data-value="no" class="button">No</button>
  </div>
  <div class="float-clear"></div>
</label>

$(document).ready(function(){

  $('button').on('click', function(e) {
    e.preventDefault();
    var option = $(this).parent('.right').parent('label').attr('id');
    var value = $(this).data('value');

    $('#'+option).find('input[type=radio]').prop('checked', false);

    $('#'+option+' input[value='+value+']').prop('checked', true);

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

    console.log(income_this_tax_year);
  })

});