mootools className не определено - PullRequest
Новая
       8

mootools className не определено

1 голос
/ 23 сентября 2011

Я действительно не понимаю, почему этот кусок кода не будет работать: 

$$('.nav_contact').addEvent('click', function(){  
    if (this.getStyle('color') != '#ffc000') {
        this.tween('color','#ffc000');
        alert(this.className);
        $$('.navigation').getElements('a').each(function(a) {
            alert(a.className);
            if (a.className != 'nav_contact') {
                a.tween('color','#b2b1af');
            }
        });
    }
});

вот соответствующий HTML-код: 

<nav class="navigation">
            <ul>
                <li><a class="nav_foo">Portfolio</a></li>
                <li><a class="nav_bar">Services</a></li>
                <li><a class="nav_contact">Contact</a></li>
            </ul>
            </nav>

Это должно подсвечивать нажатую кнопку и как-то скрывать остальные. Проблема в том, что я не могу получить элементы className сразу после ввода каждого из них. Предупреждение дает мне «неопределенный». Кто-нибудь?

1 Ответ

1 голос
/ 23 сентября 2011

это будет трудно масштабировать / шаблон как есть.

рассмотрим что-то вроде этого: 

(function() {
    var navItems = $$(".navigation a");

    document.getElements("a.nav_contact").addEvent("click", function() {
        var self = this;
        if (this.getStyle('color') != '#ffc000') {
            this.tween('color', '#ffc000');

            navItems.each(function(a) {
                // more scalable - change all but the current one w/o special references.
                if (a != self) {                      
                    a.tween('color', '#b2b1af');
                }

                return;
                // or check if it has an implicit class name...
                if (!a.hasClass("nav_contact"))
                    a.tween('color', '#b2b1af');

                // or check if the only class name is matching...
                if (a.get("class") != 'nav_contact')
                    a.tween('color', '#b2b1af');


            });
        }
    });
})();

jsfiddle: http://jsfiddle.net/dimitar/V26Fk/

Чтобы ответить на ваш оригинальный вопрос, хотя. Даже несмотря на то, что CURRENTLY mootools возвращает правильный элемент-элемент, это не всегда так. Не думайте, что это произойдет, и ВСЕГДА используйте API для получения свойств объекта, например. element.get("class") против el.className - он также отображает различия между браузерами. то же самое для значения, текста и т. д. - просто дисциплинируйте себя, чтобы использовать API, или вы не сможете перейти на mootools 2.0

...