1

これが私が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>

したがって、現在、ボックスの1つで「はい」を押すと、余分なフィールドが表示されますが、もう一方のボックスで「いいえ」を押すと、フィールドが消えます。その逆も同様です。どうすればそうできますか？どちらかが「はい」に設定されている限り、開いたままになりますか？

ここにリンクがあります：http：//jsfiddle.net/madcaesar/hcZXf/

4

3 に答える 3

3

変更が発生したときに「はい」オプションがオンになっていることを確認してください。

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/

于 2012-11-30T18:35:40.890 に答える
1 
$('input[type="radio"]').change(function() {
if ($('input[type="radio"][value="Yes"]:checked').length > 0) {
    $("#DifficultyObtainingCME").show();
} else {
    $("#DifficultyObtainingCME").hide();
}
});

もちろん、後でラジオ ボタンを追加した場合、これはそれらにも適用されます。その場合、これを適用するクラスにクラスを追加します (例: $('.toggleRadioClass[value="Yes"]:checked'))。$("#DifficultyObtainingCME").toggle(this.value == "Yes"); の意味がわからない するはずですが、私のコードは実際に要素を表示および非表示にします。

于 2012-11-30T19:31:03.997 に答える
0

:checkedyes-radiosの存在に基づいて可視性を設定します。

var $radios = $("input[name^='DifficultyObtainingCME']"),
    $toggle = $("#DifficultyObtainingCME");

$radios.on("change", function(){
    $toggle.toggle(!!$radios.filter("[value='Yes']:checked").length);
});

フィドル: http://jsfiddle.net/8wD8D/3/

于 2012-11-30T18:44:22.677 に答える