JQuery第二个单选按钮不起作用

我在更新JQuery页面上的第二个单选按钮值时遇到问题。JQuery第二个单选按钮不起作用

这里是我的HTML：

<div id="system-modes-fpa" class="ui-buttonset"> 
    <input type="radio" id="system-fpa-mode-TIMELAPSE" name="radio" value="TIMELAPSE" class="ui-helper-hidden-accessible"> 
    <label for="system-fpa-mode-TIMELAPSE" class="ui-button ui-widget ui-state-default ui-button-text-only ui-corner-left" role="button" aria-disabled="false" aria-pressed="false"><span class="ui-button-text">Timelapse</span> 
    </label> 
    <input type="radio" id="system-fpa-mode-CONTINUOUS" name="radio" value="CONTINUOUS" class="ui-helper-hidden-accessible"> 
    <label for="system-fpa-mode-CONTINUOUS" class="ui-button ui-widget ui-state-default ui-button-text-only" role="button" aria-disabled="false" aria-pressed="false"><span class="ui-button-text">Continuous</span> 
    </label> 
    <input type="radio" id="system-fpa-mode-RAMP_AND_HOLD" name="radio" value="RAMP_AND_HOLD" class="ui-helper-hidden-accessible" checked="checked"> 
    <label for="system-fpa-mode-RAMP_AND_HOLD" class="ui-button ui-widget ui-state-default ui-button-text-only ui-corner-right" role="button" aria-disabled="false" aria-pressed="false"> <span class="ui-button-text">Ramp and Hold</span> 
    </label> 
</div> 
<div id="system-modes-stillimage" class="ui-buttonset"> 
    <input type="radio" id="system-stillimage-mode-TIMELAPSE" name="radio" value="TIMELAPSE" class="ui-helper-hidden-accessible"> 
    <label for="system-stillimage-mode-TIMELAPSE" class="ui-button ui-widget ui-state-default ui-button-text-only ui-corner-left" role="button" aria-disabled="false" aria-pressed="false"> <span class="ui-button-text">Timelapse</span> 
    </label> 
    <input type="radio" id="system-stillimage-mode-CONTINUOUS" name="radio" value="CONTINUOUS" class="ui-helper-hidden-accessible"> 
    <label for="system-stillimage-mode-CONTINUOUS" class="ui-button ui-widget ui-state-default ui-button-text-only" role="button" aria-disabled="false" aria-pressed="false"><span class="ui-button-text">Continuous</span> 
    </label> 
    <input type="radio" id="system-stillimage-mode-RAMP_AND_HOLD" name="radio" value="RAMP_AND_HOLD" class="ui-helper-hidden-accessible"> 
    <label for="system-stillimage-mode-RAMP_AND_HOLD" class="ui-button ui-widget ui-state-default ui-button-text-only ui-state-active ui-corner-right" role="button" aria-disabled="false" aria-pressed="true"><span class="ui-button-text">Ramp and Hold</span> 
    </label> 
</div>

这里是我的javascript：

var continuousButton = $('#system-fpa-mode-CONTINUOUS'); 
continuousButton.prop('checked', true); 

// try uncommenting the following two lines to see the first set of radio buttons lose their value 
//var stillimageButton = $('#system-stillimage-mode-CONTINUOUS'); 
//stillimageButton.prop('checked', true);

http://jsfiddle.net/bYk6y/10/

当第二更新被调用时，第一无线电组将失去它的价值。我究竟做错了什么？

来源

2014-01-06 mike boldischar

你只有一个单选按钮组。他们都有'name ='radio''。 – Barmar