CSSクラスの存在に基づいてMooTools if/then/elseを切り替える

Question

クラスを切り替えて、特定のdivに割り当てられたcssクラスに基づいていくつかの他のアクションを実行しようとしています。

私はMooTools 1.2.5を使用しています。

div要素は次のようになります。JavaScriptを使用して訪問者のための

<a href="#" class="loginlink">Show/Hide Login</a> 

は、フォームが自動的に私のスクリプトによって隠されている有効：

<div class="loginbox"> Login Form Here </div> 

私はこのようになりますページ上のリンクを持っています。

<script type="text/javascript"> 

window.addEvent('domready',function() { 

    $$('div.loginbox').addClass('hidden'); 

    $$('a.loginlink').each(function(linkitem){ 

     linkitem.addEvent('click', function(i){ 

      displayis = $$('div.loginbox').hasClass('hidden'); 

      if (displayis) { 
       $$('div.loginbox').removeClass('hidden'); 
       // do several things 
      } else { 
       $$('div.loginbox').addClass('hidden'); 
       // do several other things   
      }; 

     }); 
    }); 

}); 

</script> 

最初の時間は、「表示/非表示ログイン」リンクをクリックすると、すべてが正常に動作する表示され、クラス「loginbox」とdivが画面に表示されます。

「ログインの表示/非表示」リンクをクリックすると、何も起こりません。 console.logを使って何が起きているのかを調べようとすると、if文の最初の部分が明らかに間違っていると評価されているように見えます。

私は "loginbox"をIDに変更してそれに応じてスクリプトを調整すれば、上のスクリプトについて不思議な点があります。私は "loginbox"クラスではなく、divを必要とするCMSを使用しています。

単に「.toggleClass（ 'hidden'）」を使用すると、クラスを切り替えるだけではなく、もっと上手くやりたいこと以外はうまくいきます。

お時間をいただきありがとうございます。

-Brent

displayis = $$('div.loginbox').hasClass('hidden');

Answer 1

- >それは配列に結果を押し、HTMLコレクションのすべてのメンバーにhasClassと同様に、これはかなり冗長です。

リライトへ：

var theHiddenEl = document.getElement("div.loginbox.hidden"); 

それは両方のクラスを持っている場合、それは要素を返します。

if (theHiddenEl) { 
    theHiddenEl.toggleClass("hidden"); // or removeClass etc. 
    // ... more stuff 
} 
...