动态检查单选按钮，基于“值”属性，不检查

Posted 2023-02-22

【中文标题】动态检查单选按钮，基于“值”属性，不检查

【英文标题】：Dynamically checked radio button, based on 'value' attribute, not checking

【发布时间】：2012-09-30 08:59:41

【问题描述】：

试图获取一个表单来加载页面，其中之前检查过的收音机已经检查过（在新加载时）。

该页面的提交作为 php 变量保存，我可以将其传递到 javascript 中，其余的应该很简单，但它不适合我。

我的代码：

<div class="question">
            <label for="sv_213">Question?</label> 
            <input 
                    class="radio"
                    type="radio" 
                    value="Yes" 
                    name="sv_213" 
                />Yes
            <input 
                    class="radio"
                    type="radio" 
                    value="No" 
                    name="sv_213"
                />No

        </div>

我的javascript：

$(function() 
    var $213 = Yes;
    $("input[name='sv_213'][value="$213"]").attr('checked', true);

    );?

在上面的js中

var $213 = <dynamically generated content>

使其设置为等于被选中的单选按钮的值

这是一个无法正常工作的 js fiddle： http://jsfiddle.net/CW8AC/

非常感谢您的帮助。

顺便说一句，我的代码是基于这个，以前问过的问题： Set selected radio from radio group with a value

【问题讨论】：

这不会改变我在我的页面或 jsfiddle 上的结果：jsfiddle.net/CW8AC/2

【参考方案1】：

您需要在值“Yes”周围加上引号，因为这是一个字符串，而不是布尔值或数字。

var $213 = "Yes";

另外，您需要将变量添加到带有 + 的选择器中，如下所示：

$("input[name=sv_213][value="+$213+"]").attr('checked', true);

更新小提琴，工作：http://jsfiddle.net/CW8AC/1/

完整的js代码：

$(function() 
    var $213 = "Yes";
    $("input[name=sv_213][value="+$213+"]").attr('checked', true);

    );

更新：## 从 jQuery 1.6 开始，您还可以使用带有布尔值的 .prop 方法（这应该是首选方法）：

$("input[name=sv_213][value="+$213+"]").prop('checked', true);

在我的例子中，.attr() 方法不能用于动态选择单选按钮，而 .prop() 可以。

【参考方案2】：

在 D3 中，以防有人想知道。

d3.selectAll("input[name='sv_213'][value=" + $213 + "]").property("checked", true);

【参考方案3】：

JavaScript 解决方案是：- 只需两 (2) 个单选按钮：

let radios = document.getElementsByName(nameProperty);
let value = "1";//value you want to compare radio with

if (radios[0].value == value) 
  radios[0].checked = true;
else
  radios[1].checked = true;

三个或更多单选按钮：

let radios = document.getElementsByName(nameProperty);
let value = "1";//value you want to compare radio with

for (let i = 0, length = radios.length; i < length; i++) 
  if (radios[i].value == value) 
    radios[i].checked = true;
    
    // only one radio can be logically checked, don't check the rest
    break;