Есть ли способ зафиксировать состояние элемента до того, как сработает механизм MutationObserver (onVisibilityChanged)?

Я пытаюсь получить информацию об изменении состояния элемента с помощью javascript MutationObserver
Чтобы получить состояние элемента до изменения, затем проверьте текущее состояние и на его основе примите некоторые решения.

В основном я пытаюсь реализовать событие onVisibilityChanged.

Я фиксирую любые изменения элементов, которые мне небезразличны, а затем проверяю, видны они или нет. Затем, если видимость отличается от того, что было передано 'visibilityChanged'.
Я знаю обходной путь, который я мог бы сделать, поскольку я получаю произошедшие изменения, я мог бы создать клон элемента (MutationEvent[0].target) и отменить все изменения. затем проверьте, виден ли клон, однако это звучит «хакерски» и неэффективно, поэтому мне было интересно, есть ли способ захвата элемента прямо перед тем, как произошла мутация. Я понимаю, что это маловероятно, так как MutationObserver уволен после того, как произошли все изменения, и это похоже на путешествие во времени, но я внимательно прислушиваюсь к вашим предложениям.

var observer = new MutationObserver(function(mutations) {
var itemFromThePast = mutations[0].MagicTimeMachine().GetMeTheItemBeforeItWasChanged; // this is the line that is missing
if ($(itemFromThePast).is(":visible") != $(mutations[0].target).is(":visible"))
      {
       console.log('I win!');
      }

});
var targets = $('.ui-collapsible-content');

$.each(targets, function(i,target){
observer.observe(target, { attributes: true, childList: false, characterData : true,     characterDataOldValue : true });
});

javascript jquery dom mutation-observers javascript-events
person Matas Vaitkevicius    schedule 20.03.2014    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Один из способов сделать это.
Работает только с изменениями видимости, вызванными изменением класса.

var observer = new MutationObserver(function(mutations) {
    var clone = $(mutations[0].target).clone();
    clone.removeClass();
    for(var i = 0; i < mutations.length; i++){
        clone.addClass(mutations[i].oldValue);
    }
    $(document.body).append(clone);
    var cloneVisibility = $(clone).is(":visible");
    $(clone).remove();
    if (cloneVisibility != $(mutations[0].target).is(":visible")){
        var visibilityChangedEvent = document.createEvent('Event');
        visibilityChangedEvent.initEvent('visibilityChanged', true, true);
        mutations[0].target.dispatchEvent(visibilityChangedEvent);
    }
});

var targets = $('.ui-collapsible-content');
$.each(targets, function(i,target){
    target.addEventListener('visibilityChanged', function(){ console.log('Kaboom babe');});
    observer.observe(target, { attributes: true, attributeFilter : ['class'], childList: false, attributeOldValue: true });
});
person Matas Vaitkevicius    schedule 20.03.2014