使用jQuery根据选中的单选按钮添加/删除类

我有两个单选按钮。选中一个收音机时，它需要向其他收音机标签添加一个类。如果未选中，则删除该类。听起来很简单，但我似乎无法让它工作。我这里有一个普朗克的例子

---

您已经在页眉中添加了脚本文件，因此需要将脚本放在dom就绪处理程序中，否则在执行脚本时，不会将单选元素添加到dom中，因此不会注册单击处理程序

jQuery(function($){
    $("#optionsRadios1:radio").click(function () {
        $('label.choose-existing').toggleClass('radio-disabled', this.checked);
    });

    $("#optionsRadios2:radio").click(function () {
        $('label.choose-image').addClass('radio-disabled', this.checked);
    });
})

演示：

---

还要注意，由于引导需要jQuery，所以需要在引导之前包含jQuery

  <script data-require="jquery@2.1.3" data-semver="2.1.3" src="http://code.jquery.com/jquery-2.1.3.min.js"></script>
  <script data-require="bootstrap@*" data-semver="3.3.2" src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>

演示：

这是您需要的（还要注意代码的差异）：

---

到目前为止你尝试了什么？请发布您的代码来处理它。您的javascript代码是否在

标记之间？而且我认为这个。检查过的不好。如果（$（this）.is（':checked'），则应为

if{

在您的plunker示例中，看起来您的包含方式不对。您需要在包含引导js文件之前包含Jquery，并且您的页面上出现错误：

错误：引导的JavaScript需要Jquery

看起来，Jquery没有加载。如果是checkedIts，则实际上并没有删除该类如果选中该类，则不会实际删除该类

jQuery(function($){
    $("#optionsRadios1:radio").click(function () {
        $('label.choose-existing').toggleClass('radio-disabled', this.checked);
    });

    $("#optionsRadios2:radio").click(function () {
        $('label.choose-image').addClass('radio-disabled', this.checked);
    });
})

  <script data-require="jquery@2.1.3" data-semver="2.1.3" src="http://code.jquery.com/jquery-2.1.3.min.js"></script>
  <script data-require="bootstrap@*" data-semver="3.3.2" src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>

jQuery(function($){
    var $radios = $('input[name="optionsRadios"]').click(function () {
        $(this).next().removeClass('radio-disabled');
        $radios.not(this).next().addClass('radio-disabled');
    });
})

if($('#optionsRadios1').is(':checked')) { 
     $('label.choose-image').addClass('radio-disabled');
}
 else if($('#optionsRadios2').is(':checked')) { 
     $('label.choose-image').addClass('radio-disabled');
}
else {
       // do something
}

 $(document).ready(function(){

    jQuery("input[name = 'optionsRadios']").click(function() {
            if ($(this).val() === "uploadImage") {
                $('label.choose-existing').addClass('radio-disabled');
                $('label.choose-image').removeClass('radio-disabled');
            } else {
                $('label.choose-existing').removeClass('radio-disabled');
        $('label.choose-image').addClass('radio-disabled');
            }
        });

});

$(document).ready(function(){
   $( "input:radio[name=optionsRadios]" ).on( "click", function() {
     $('label.choose-image,label.choose-existing').removeClass('radio-disabled');
    if ($(this).val().toLowerCase() === "uploadimage") {
       $('label.choose-existing').addClass('radio-disabled');
     } else {
             $('label.choose-image').addClass('radio-disabled');
     }
   });
});