Я использую другой стиль флажка, который использует переключатель: после псевдо / класса, а затем он проверяется, он становится переключателем: проверено: после

Когда я напрямую нажимаю на ввод, он работает нормально. Но поскольку я также использую опцию «Выбрать все», после того, как я вручную изменил состояние флажка, «Выбрать все / Отменить выбор всех» игнорирует: после.

Так выглядит мой код

$('#selectAllFeeds').on('click',function(){
    if (allFeedsSelected == 0) {

        $('.rss-feed-checkboxes:visible').each(function(){
            $(this).attr('checked',true);
            $('#selectAllFeeds').html('Deselect all');
        });

        allFeedsSelected = 1;
        syncCheckboxes();

    } else if (allFeedsSelected == 1) {

        $('.rss-feed-checkboxes:visible').each(function(){
            $(this).attr('checked',false);
            $('#selectAllFeeds').html('Select all');       
        });

        allFeedsSelected = 0;
        syncCheckboxes();

    }
    countCheckboxes();

});

Мои флажки выглядят так

<input type="checkbox" id="Arabian Business" class="rss-feed-checkboxes toggle">

CSS:

.rss-feeds-overview .toggle:checked:after {
    background: #d20a11;
    left: 40px;
}
.rss-feeds-overview .toggle:after {
    content: "";
    background: #999;
    display: block;
    height: 15px;
    width: 15px;
    border-radius: 100%;
    position: absolute;
    left: 0px;
    transform: scale(2);
    cursor: pointer;
    transition: all 0.4s ease;
}
.rss-feeds-overview .toggle:checked {
    background-color: #dc9490;
}

Я думаю, что почему-то псевдоним: checkbox не добавляется в класс .toggle, когда я нажимаю Select All.

Как я могу добавить здесь псевдо: псевдо в .toggle? Сам флажок не установлен = "установлен", поэтому флажок установлен, только визуально он не виден.

Благодарность!

0
Bas 6 Мар 2019 в 13:24

1 ответ

Лучший ответ

Пример кода с некоторой модификацией для тестирования

<input type="checkbox" id="Arabian Business" class="rss-feed-checkboxes toggle">
<button id="selectAllFeeds">btn</button>


$('#selectAllFeeds').on('click',function(){
var allFeedsSelected = $(".toggle").is(":checked") ? 1 : 0 ;
console.log(allFeedsSelected);
    if (allFeedsSelected == 0) {

        $('.rss-feed-checkboxes:visible').each(function(){
            $(this).prop("checked",true);
            $('#selectAllFeeds').html('Deselect all');
        });

        allFeedsSelected = 1;
        //syncCheckboxes();

    } else if (allFeedsSelected == 1) {

        $('.rss-feed-checkboxes:visible').each(function(){
            $(this).prop("checked",false);
            $('#selectAllFeeds').html('Select all');       
        });

        allFeedsSelected = 0;
        //syncCheckboxes();

    }
   // countCheckboxes();

});
0
thedudecodes 6 Мар 2019 в 10:45