javascript - 如果将两个单选按钮设置为 "Yes"，我如何组合它们以显示相同的元素？

Question

这是我在 jQuery 中所拥有的:

$(document).ready(function(){
    $("input[name='DifficultyObtainingCMELicenseRenewal']").change(function() {
      $("#DifficultyObtainingCME").toggle(this.value == "Yes");
    });
    $("input[name='DifficultyObtainingCMEBoardCertification']").change(function() {
      $("#DifficultyObtainingCME").toggle(this.value == "Yes");
    });
});

这是 HTML:

 <tr>
    <th><label>Do you have difficulty obtaining enough CME required for Iowa license renewal?</label></th>
    <td>
        <label><input type="radio" name="DifficultyObtainingCMELicenseRenewal" value="Yes" class="checkbox"/> Yes</label><br />
        <label><input type="radio" name="DifficultyObtainingCMELicenseRenewal" value="No" class="checkbox"/> No</label>
    </td>
  </tr>
  <tr>
    <th><label>Do you have difficulty obtaining enough CME required for your specialty board certification/re-certification?</label></th>
    <td>
        <label><input type="radio" name="DifficultyObtainingCMEBoardCertification" value="Yes" class="checkbox"/> Yes</label><br />
        <label><input type="radio" name="DifficultyObtainingCMEBoardCertification" value="No" class="checkbox"/> No</label>
    </td>
  </tr>
  <tr id="DifficultyObtainingCME" style="display:none">
    <th class="altTH"><label>Please elaborate on the difficulties you are experiencing:</label></th>
    <td class="altTD">
        <cftextarea name="DifficultyObtainingCMEOther" rows="3" cols="20"></cftextarea>
    </td>
  </tr>

所以现在，如果您在其中一个框上按"is"，它会显示额外的字段，但在另一个框上按“否”会使它消失，反之亦然。我如何做到这一点，只要其中一个设置为"is"，它就会保持打开状态？

这是一个链接:http://jsfiddle.net/madcaesar/hcZXf/

Answer 1

只需确保在更改发生时选中"is"选项:

var thingToToggle = $("#DifficultyObtainingCME");
var allRadios = $('input[type="radio"]');

allRadios.change(function () {
    if (allRadios.filter(function () {
        return this.checked && this.value === 'Yes';
    }).length > 0) {
        thingToToggle.show();
    } else {
        thingToToggle.hide();
    } 
});

http://jsfiddle.net/JptF8/