1

そのコードが機能しない理由がよくわかりません。

$$('.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要素を取得できないことです。アラートは私に「未定義」を与えます。誰か？

4

1 に答える 1

1

これは、そのままではスケーリング/パターン化が困難になります。

次のようなことを考えてください。

(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/

しかし、あなたの元の質問に答えるために。現在、mootoolsは適切な要素オブジェクトを返しますが、常にそうであるとは限りません。そうなると思い込まないでください。常にAPIを使用してオブジェクトのプロパティを取得します。element.get("class")vs-el.classNameブラウザの違いのマッピングも行います。価値、テキストなどについても同じです-APIを使用するように自分を訓練するだけです。そうしないと、mootools2.0にアップグレードできません。

于 2011-09-23T08:57:37.793 に答える