jquery - $(文档).on ('change' ,'.child-21' ,function(){ });动态类

Question

我想实现我的功能，每当我单击单选按钮时，我都想调用动态类，例如 - child-21-1、child-22-2。但我不知道如何使类动态化:

$(document).on('change','.child-21', function() {});

在此基础上我想显示隐藏其他div。

$(document).on('change','.child-21',function(){
    if($(this).val()=='No') {
        $('.class-1').show();
        $('.class-2').show();
        $('.class-3').show();
        $('.class-4').show();
    } else if($(this).val()=='Yes') {
        $('.class-1').hide();
        $('.class-2').hide();
        $('.class-3').hide();
        $('.class-4').hide();
    } else {
        if ($('#ssn1').prop("checked") == true){
            $('#single-text').hide();
            $('.class-2').hide();
        } else if($('#ssn1').prop("checked") == false) {
            $('#single-text').show();
            $('.class-2').hide();
        } else {
            $('.child-21-div').slideDown();
            $('.class-2').hide();
        }   
    }
});

HTML代码

<div class="radio-inline">
    <input id="over21" type="radio" name="over21[<?php echo $i; ?>]" class="child-21<?php echo $i; ?>" value="Yes" <?php echo (isset($_SESSION['step4a_data']['over21'][$i]) && $_SESSION['step4a_data']['over21'][$i]=='Yes') ?'checked':''; ?>><label for="radio1">Yes</label>
</div>
<div class="radio-inline">
    <input id="over22" type="radio" name="over21[<?php echo $i; ?>]" class="child-21<?php echo $i; ?>" value="No" <?php echo (isset($_SESSION['step4a_data']['over21'][$i]) && $_SESSION['step4a_data']['over21'][$i]=='No') ?'checked':''; ?> ><label for="radio2"> No</label>
</div>

Answer 1

更新 html 后绑定(bind)更改方法

$('.child-21').unbind();
if($('.child-21').length > 0 && $._data($('.child-21')[0],"events") == undefined){
    $('.child-21').bind('change',function(){
        // write your code
    });
}