如何使用 jQuery 动态更改选定的单选按钮答案

【问题标题】：How to change the selected Radio button dynamically with jQuery如何使用 jQuery 动态更改选定的单选按钮
【发布时间】：2012-04-12 17:31:45
【问题描述】：

假设我有几行单选框，每行有 4 个选项... 1、2、3 和一个空白值。

<input name="addons_1[23]" type="radio" value="1" />
<input name="addons_1[23]" type="radio" value="2" />
<input name="addons_1[23]" type="radio" value="3" />
<input name="addons_1[23]" type="radio" value="" />

<input name="addons_1[32]" type="radio" value="1" />
<input name="addons_1[32]" type="radio" value="2" />
<input name="addons_1[32]" type="radio" value="3" />
<input name="addons_1[32]" type="radio" value="" />

<input name="addons_1[45]" type="radio" value="1" />
<input name="addons_1[45]" type="radio" value="2" />
<input name="addons_1[45]" type="radio" value="3" />
<input name="addons_1[45]" type="radio" value="" />

<input name="addons_1[46]" type="radio" value="1" />
<input name="addons_1[46]" type="radio" value="2" />
<input name="addons_1[46]" type="radio" value="3" />
<input name="addons_1[46]" type="radio" value="" />

<input name="addons_1_noneed" id="addons_1_noneed" type="checkbox" /><label for="addons_1_noneed">Addons not needed.</label>

在这种情况下，我想设置它，以便当最后的输入复选框 (id=addons_1_noneed) 被选中时，我想让单选框（全部）选中第 4 个（其中值=“”）。根据代码，我无法将其更改为非空值。

所以我在附加到#addons_1_noneed元素的点击函数上尝试了以下函数：

$('#addons_1_noneed').click(function(){
   $("input[name='addons_1[]'] option[value='']").each(function({
      $(this).attr("selected","selected");
   });
});

没有用。

$('#addons_1_noneed').click(function(){
   $("input[name='addons_1[]']").each(function({
      $(this).val('');
   });
});

也没有用。

我错过了什么？

【问题讨论】：

console.log($(this))，然后从那里开始。确保选择器有效。
嗯...console.log 吐出了什么？
我将 onclick 函数分离为一个单独的函数......现在我没有任何运气。该函数运行，但随后说函数是“未定义”，这绝对没有意义..如果函数有错误，它甚至不会开始运行吗？我把警报（“我！”）；在选择器开始测试函数是否被调用之前，在函数的开头。运行良好。但控制台日志没有发生.. WTF !!??
我是个白痴...我忘记了 addons_1[xx] 数组 ID 是由 mysql ID 定义的，所以我的选择器不起作用（addons_1_[]）。谢谢！
嗯，好的。从简单开始。暂时注释掉您的点击内容。让我们确保您抓住了正确的选择器。 var test = $("input[name='addons_1[]']");控制台.log（测试）；在您使用的任何浏览器中打开检查器，然后检查对象。

标签： jquery dom input radio-button

【解决方案1】：

var notesStatusValue = '<c:out value="${tradeMarkWatchReportSearchDto.notesStatusValue}"/>' ;
        jq("input:radio[name=notes]").each(function(){
            if(jq(this).val() == notesStatusValue) {
                jq(this).attr('checked','checked');
            }
        });

<input type="radio" name="notes" id="notes" value="Y">
                    <spring:message code="tm.report.search.added" text="DEBUG: Added" />
                    <input type="radio" name="notes" id="notes" value="N">
                    <spring:message code="tm.report.search.none" text="DEBUG: None" />
                    <input type="radio" name="notes" id="notes" value="ignore">
                    <spring:message code="tm.report.search.ignore" text="DEBUG: Ignore" />

【讨论】：

【解决方案2】：

$(document).ready(function(){
    $('#addons_1_noneed').click(function(){
        if($(this).attr('checked')=="checked"){
            $('input:radio').attr('checked', true);
        }else{
            $('input:radio').attr('checked', false);
        }

    });
});

演示：http://jsfiddle.net/bNcRn/1/

【讨论】：