How to catch event when element change a class

html

<div id="foo">Click a Button!</div>
<button id="add">Add</button>
<button id="remove">remove</button>

css

#foo{ background-color: red; }
#foo.green{ background-color: green; }

js

function addClassNameListener(elemId, callback) {
var elem = document.getElementById(elemId);
var lastClassName = elem.className;
window.setInterval( function() {
var className = elem.className;
if (className !== lastClassName) {
callback();
lastClassName = className;
}
},10);
}

document.getElementById("add").onclick = function(){
document.getElementById("foo").className = "green";
}

document.getElementById("remove").onclick = function(){
document.getElementById("foo").className = "";
}

addClassNameListener("foo", function(){ alert("changed"); });

 

http://jsfiddle.net/gJgmV/1/

Trả lời

Thư điện tử của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *