Показать сообщение отдельно
  #1 (permalink)  
Старый 19.05.2015, 18:11
Аватар для ogurchik
Аспирант
Отправить личное сообщение для ogurchik Посмотреть профиль Найти все сообщения от ogurchik
 
Регистрация: 23.02.2015
Сообщений: 45

кастомизация чекбоксов
Нужно сделать чекбоксы "красивыми".
На лейбл, в которых лежат чекбоксы, прикрепляется класс "checkbox-checked" в котором картинка с отмеченным чекбоксом. Так на лейбле на бекграунде стоит картинка пустого чекбокса.
вторая цепочка методов не работает как надо, если нажать на чекбокс, то класс "checkbox-checked" снимается со всемх чекбоксов, и присвается тому чекбоксу, на который был произведен клик. если чекбокс уже был отмечен, то класс снимается и с него тоже.
$(window).load(function() {
//проверяет при загрузке страницы, отмечен чекбокс или нет и на отмеченные чекбоксы вешает класс.
    $('input[type="checkbox"]').each(function () {
        if ($(this).prop('checked')) {
            $(this).parent().addClass('checkbox-checked');
        }
     });

  //по клику лейблу присваивается или удаляется класс, в зависимости от того, что в атрибуте "checked". 
    $('input[type="checkbox"]').bind("change", function(){
      if ($(this).is(":checked")) {
          $(this).parent('label').addClass('checkbox-checked');
      }
      else {
         $(this).parent('label').removeClass('checkbox-checked');
      }
    });

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