MutationObserver по значению класса - PullRequest
Новая
       9

MutationObserver по значению класса

0 голосов
/ 21 сентября 2018

Я хочу обнаружить изменения в классе = 'value' и автоматически выполнять действия.

HTML: 

<div class="s3upload form-active">

<!-- after the form is submitted, 
     an external lib changes the class to: -->
<div class="s3upload link-active">

Приведенный ниже код работает без ошибок.Но он запускает оба оператора if ... так что он сам себя отменяет.

В идеале я мог бы сузить мутацию до конкретных значений атрибута класса: "s3upload form-active "" s3upload link-active "

JS: 

// node to observe
const picLink = $('.s3upload')[0];

const observer = new MutationObserver(function
    (mutations) {
        mutations.forEach(function (mutation) {

            // mutations to check for:
            if (mutation.attributeName === 'class') {
                console.log(mutation.type), console.log("active");
                $('#saver').css('display', 'block');
            }
            if (mutation.oldValue) {
                console.log(mutation.type), console.log("removed");
                $('#saver').css('display', 'none');
            }
        })
    }
)

observer.observe(
    picLink, 
    {
        // things related to picLink to watch for changes
        attributes: true, 
        attributeFilter: ['class'],
        childList: false, 
        characterData: true,
        attributeOldValue: true
    }
)

Я следил за этими документами / документами

https://developer.mozilla.org/en-US/docs/Web/API/MutationRecord

https://www.youtube.com/watch?v=Hn2zzi_lquA

...