Mootools：如果满足以下条件，如何更改css类

Question

如果textarea没有聚焦并且其中包含超过10个字符，我想将标签类更改为“labelDeactivated”。我该如何做到这一点？尝试了几个解决方案，但没有运气:-(。 顺便说一句，如果条件不符合，它应该转回标签。

<p class="label">Your review</p>
<textarea id="review" name="review"></textarea>

Answer 1

http://www.jsfiddle.net/7SmwU/

document.id("review").addEvents({
    keyup: function() {
        if (this.get("value").trim().length >= 10)
            this.getPrevious().addClass("labelDeactivated");
        else
            this.getPrevious().removeClass("labelDeactivated");
    }
});

顺便说一下，使用<label for='review'>your review</label> - 更好的语义标记和可访问性。

Answer 2

结束此解决方案：http://jsfiddle.net/kkgp2/

var headline = $$('.headline');
var headlineLabel = $$('.headlineLabel');
var headlineNote = $$('.headlineNote');

// Change label //
headline.addEvent('blur', function(){
    headlineNote.fade('hide');
    if (this.value.length>10) {
        headlineLabel.addClass('labelDone');
    }
    else{
        headlineLabel.removeClass('labelDone');
    };
});