Как использовать флажок, чтобы изменить ли, а также стандартный клик?

Вопрос:

Я использую jQuery для изменения стиля элементов li, а также проверки флажка. Это код:

$(".md-popover-dayselect li").click(function() {
if($(this).children().children(".md-popover-checkbox").is(":checked")) {
$(this).css("background-color", "");
$(this).css("color", "");
$(this).children().children(".md-popover-checkbox").attr("checked", false);
} else {
$(this).css("background-color", "#FFF");
$(this).css("color", "#64a3c0");
$(this).children().children(".md-popover-checkbox").attr("checked", true);
}
});

Проблема, с которой я столкнулась, теперь флажок сам по себе не работает. Как вы предлагаете мне заставить его работать? Должен ли я писать код, специально обрабатывающий флажок, или есть лучший способ?

Edit: Когда я говорю не работает, я имею в виду, что флажок сам по себе не «проверяет» и не меняет элементы li (то есть фоновый цвет и цвет), как указано выше.

Лучший ответ:

Попробуйте использовать prop вместо attr для установки логических свойств элемента.

$(this).children().children(".md-popover-checkbox").prop("checked", false);

Попробуй это:

$(".md-popover-dayselect li").click(function() {

    var $this = $(this);
    var checked = $this.children().children(".md-popover-checkbox").is(":checked");
    var cssObj = {"background-color": "","color":""};
    if(!checked) {
         cssObj = {"background-color": "#FFF","color","#64a3c0"};

     $this.css(cssObj);

     $this.children().children(".md-popover-checkbox").prop("checked", !checked);
});

Также обратите внимание, что дети будут выбирать только прямых потомков, поэтому вы можете захотеть проверить, что ваш выбор возвращает элементы вообще.

Оцените статью
TechArks.Ru
Добавить комментарий