单选按钮html缺少已检查属性,但firebug表示已选中

时间:2012-02-27 16:33:20

标签: javascript jquery javascript-events jquery-1.5

提前感谢您的时间。

问题陈述摘要:浏览器上的单选按钮html不显示已检查的属性,但Firebug指示已将收音机的已检查属性设置为已选中

经过测试

Broswer:FF 3.6.18和IE8 jQuery:1.5 MVC3(Razor)

详情

使用MVC3(使用Razor)我正在从服务器渲染以下单选按钮。所需的功能是在检查一个无线电时,另一个应该是未选中的,反之亦然。换句话说,允许用户只选择一个选项 - 比如val1或val2。

<div id="myRadioList">
    <div>
        <input type="radio" value="val1" onclick="updateFunctionCalledHere(this)" name="myRadioName" id="myRadioName_val1" checked="checked">

    </div>
    <div>
        <input type="radio" value="val2" onclick="updateFunctionCalledHere(this)" name="myRadioName" id="myRadioName_val2">
    </div>
</div>

我观察到的是,如果用户切换所选的收音机,则会显示使用firebug检查新选择的收音机(假设为myRadioName_val2),但html仍会将其他单选按钮反映为已选中。因此,其他一些验证都失败了。

我尝试删除两个单选按钮的所有已检查属性,然后检查单击的那个。

这就是我正在设置当前点击的无线电,这是无效的

$("#myRadioList > div > input[value='myRadioName_val2]').attr('checked', 'checked');

我正在简化我的代码以避免发布不必要的细节。

谢谢!

3 个答案:

答案 0 :(得分:5)

HTML 中的checked属性是默认值。 JavaScript 中的checked属性是指单选按钮的当前状态。

通常,最好让浏览器处理checked状态的单选按钮和复选框,而不是自己设置,否则会遇到这些问题。如已建议的那样,通过prop("checked")或通过.is(":checked")获取当前状态是安全的。

您可能还想考虑使用$('#myRadioList').find('input[value="myRadioName_val2"]')或更好的语法$('#myRadioName_val2'),因为jQuery中的子选择器可能相当慢,因为它们是从右向左阅读。

答案 1 :(得分:4)

你应该使用

$("#myRadioList > div > input[value=myRadioName_val2]").prop('checked', true);

答案 2 :(得分:0)

嗯,jQuery选择器中确实存在语法错误。它应该是:

$('#myRadioList > div > input[value="myRadioName_val2"]')