Jquery 取消选中一个复选框上的其他复选框，但选中标记不删除

我有两个复选框，当我点击第一个div特色播放列表复选框时，另一个流行类型应该被取消选中。但这并没有发生，只有值改变了，但选中标记没有改变。谁能帮我解决这个问题

HTML

@foreach ($popular as $genreTag)
    <li class="lib">
        <label><input class="genreTag"  id="{{ $genreTag->id}}" type="checkbox" name="" value="{{ $genreTag->name }}">{{{ $genreTag->name }}} ({{count(json_decode($genreTag->tracks, true))}}) </label>
    </li>
@endforeach

@foreach ($featured as $playlist)
    <li class="lib">
        <label><input class="filter-playlist" id='{{{ $playlist->id}}}' tracks='{{ $playlist->tracks }}' type="checkbox" value="{{ $playlist->name}}">{{ $playlist->name}} ({{count(json_decode($playlist->tracks, true))}}) </label>
    </li>
@endforeach

CSS

$('.genreTag').on('change', function (e){
    $('input.filter-playlist').not(this).prop('checked', false);
});

$('.filter-playlist').on('change', function (e) {
    $('input.genreTag').not(this).prop('checked', false);
});

.chk-area {
    border: 2px solid #d22890;
    margin: -2px 10px 0 0;
    float: left;
    width: 24px;
    height: 24px;
    border-radius: 3px;
    position: relative;
}
.chk-checked {
    background: #d22890;
    border-color: #fff;
}
.chk-unchecked {
    background: #fff;
    border-color: #d22890;
}
.ch-playlist {
    display: inline-block;
    width: 100%;
    color: #667482;
    text-decoration: none;
    padding: 10px 20px 10px 45px;
}

---

尝试在父div上使用单选按钮，即在您的案例特色播放列表中，在特定单选按钮上单击更改，取消选中所有流行类型复选框

尝试在父div上使用单选按钮，即在您的案例特色播放列表中，在特定单选按钮上单击更改，取消选中所有流行类型复选框

您的代码工作正常。但如果你想选择其中任何一个选项，最好使用输入型收音机。我准备了示例代码

$（'input:radio'）。单击（函数（）{
$（'input:radio:checked'）.addClass（'active'）；
$（'input:radio:not（：checked'））.removeClass（'active'）；
});
您的代码运行正常。但如果你想选择其中任何一个选项，最好使用输入型收音机。我准备了示例代码


$（'input:radio'）。单击（函数（）{
$（'input:radio:checked'）.addClass（'active'）；
$（'input:radio:not（：checked'））.removeClass（'active'）；
});
您的JS代码没有问题。您不需要使用
not（this）
tho，因为您可以基于类名绑定
change
事件

在发送有关生成的HTML的更多详细信息后，这是最终的解决方案

var $genreTags = $('input.genreTag'),
    $filterPlaylist = $('input.filter-playlist');

$genreTags.on('change', function (e){
    $filterPlaylist.each(function(){
        var $this = $(this);
        $this.prop('checked', false);
        // because of generated html
        $this.parent().find('> div').removeClass('chk-checked').addClass('chk-unchecked');
    });
});

$filterPlaylist.on('change', function (e) {
    $genreTags.each(function(){
        var $this = $(this);
        $this.prop('checked', false);
        // because of generated html
        $this.parent().find('> div').removeClass('chk-checked').addClass('chk-unchecked');
    });
}); 

你的JS代码还可以。您不需要使用
not（this）
tho，因为您可以基于类名绑定
change
事件

在发送有关生成的HTML的更多详细信息后，这是最终的解决方案

var $genreTags = $('input.genreTag'),
    $filterPlaylist = $('input.filter-playlist');

$genreTags.on('change', function (e){
    $filterPlaylist.each(function(){
        var $this = $(this);
        $this.prop('checked', false);
        // because of generated html
        $this.parent().find('> div').removeClass('chk-checked').addClass('chk-unchecked');
    });
});

$filterPlaylist.on('change', function (e) {
    $genreTags.each(function(){
        var $this = $(this);
        $this.prop('checked', false);
        // because of generated html
        $this.parent().find('> div').removeClass('chk-checked').addClass('chk-unchecked');
    });
}); 

你集成了一些复选框插件吗？哦，等等minutes@romil复选框用于多选如果您想要选择任何一个选择框，则使用输入类型radio@MehdiDehghani现在检查，长官，在回答时按下f12并放置一个断点，那么，在哪个选择器不工作的情况下，你能识别出你集成了一些复选框插件吗？哦，等等minutes@romil复选框用于多选如果您想要选择任何一个选择框，则使用输入类型radio@MehdiDehghani现在检查，长官，在回答时按下f12并放置一个断点，那么在哪一个选择器不起作用呢？那么可以确定先生，您的第一个答案是好的，我的问题是，当我在2号检查时，第一个复选框没有被移除。我认为这个问题来自jcf插件。如果你的第一个答案是好的，我的问题是，当我在2号检查时，第一个复选框没有被移除。我想这个问题来自jcf插件，你能帮我解决吗？@iAmGroot我回答了你的问题，你能帮我解决吗？@iAmGroot我回答了你的问题，