Слушайте изменения отмечены / отключены в JQuery

Question

У меня есть некоторый объект (div, input / checkbox) на странице HTML.Значения их атрибутов «checked» и «disabled» устанавливаются с помощью некоторых функций JS.Я хочу прослушать изменения этих атрибутов, но не могу найти какую-либо функцию или прослушиватель для их выполнения.

Как добавить прослушиватель событий, который прослушивает изменения «флажок» или «отключен» и выполняеткакой-нибудь код (например, изменение стиля флажка / div) в зависимости от статуса атрибутов?

Спасибо

Answer 1

Что касается «отключенных» изменений, вы можете прослушивать события DOMAttrModified. Смотрите этот контрольный пример для деталей: http://jsfiddle.net/4kWbp/1/

Обратите внимание, что не все UA поддерживают события мутации DOM, такие как DOMAttrModified, и в тех, которые их поддерживают, их прослушивание может привести к снижению производительности.

Установка .checked напрямую не запускает события «change» и, похоже, тоже не запускает DOMAttrModified (хотя проверено только в Opera, и это тот тип недоопределенных вещей между пробелами, хорошо быть очень непоследовательным во всех браузерах. Возможно, это ошибка Opera.)

Последним средством, возможно, будет определение методов получения / установки для этих свойств. Это было бы довольно уродливо, хотя ...

Answer 2

Вы можете использовать псевдоселекторы для :checked и :disabled и запускать пустую анимацию, которая вызывает событие animationstart. Например:

select > option:checked {
    animation: checked 1ms;
}
select > option:not(:checked) {
    animation: unchecked 1ms;
}
@keyframes checked { from {}; to {}; }
@keyframes unchecked { from {}; to {}; }

, а затем в JavaScript вы можете использовать:

document.body.querySelector('select').addEventListener('animationstart',
    function (ev) {
        console.dir(ev);
    });

Событие имеет доступные свойства animationName и target, которые дают вам достаточно для работы.

Answer 3

Используйте :checked для определения отмеченного радио или флажка на странице или в контейнере.

Прежде всего проверьте это jsfiddle

после этого выполните этот стекопотоквопрос Jquery получить выбранные флажки , чтобы написать для желаемого результата.

вы можете проверить, отключен или нет, как:

var set=1;
var unset=0;
jQuery( function() {
  $( '.checkAll' ).live('click', function() {
    $( '.cb-element' ).each(function () {
      if(set==1){ $( '.cb-element' ).attr('checked', true) unset=0; }
      if(set==0){ $( '.cb-element' ).attr('checked', false); unset=1; }
    });
    set=unset;
  });
});

Проверьте эти ссылки для подробной информации:

Jquery получить выбранные флажки

Установка «флажок» для флажка с JQuery?

Answer 4

Чтобы прослушать, когда установлен флажок, используйте change ():

$('.target').change(function() {
    console.log(this.checked ? 'Checked' : 'Not Checked');
});

Answer 5

$ ('# Checkboxid: флажок') это вернет true, если значение флажка включено, и false, если значение флажка выключено. это функция выбора jquery: флажок можно использовать для проверки значений радио и флажков.

синтаксис выглядит следующим образом:

$('#checkboxid:checked')

Answer 6

У меня нет ответа на ваш вопрос, но я мог бы предложить вам попробовать что-то вроде Event Bus (в GWT есть Event Handler).

Для JQuery вы можете использовать События .