2011-10-25 2 views
0

は、私は、このイベントが呼び出された後、押し入力があります。XUI toggleClassエラー

document.getElementById("nearest").addEventListener('click', function(){ 
    x$("#popup").toggleClass('hide'); 
}, false); 

を、私は、コンソールにこのエラーが表示されます。

x$("#popup").toggleClass is not a function 
[Break On This Error] x$("#popup").toggleClass('hide'); 

これはdiv要素と入力要素である

<div id="popup" class="hide"></div> 
<input id="nearest" type="image" name="nearest"> 
+0

XUIは動作しますが、そのちょうどこの動作しないこと – Harry

答えて

0

次のコードは、予想通りに動作するようです。—背景色を赤色から青色に切り替える(FireFoxの8.0とChrome 17.0.942.0でテスト):

<html> 
<head> 
    <style type="text/css"> 
     #popup{ 
      position:relative; 
      height:100px; 
      width:100px; 
      margin:10px; 
      background-color:red; 
     } 
     .hide{ 
      background-color:blue !important; 
     } 
    </style> 


    <script type="application/javascript" src="http://xuijs.com/downloads/xui-2.3.2.min.js"></script> 
    <script type="application/javascript"> 
     x$.ready(function() { 
      document.getElementById('nearest').addEventListener('click', function(){ 
       x$("#popup").toggleClass('hide'); 
      }, false); 
     }); 
    </script> 
</head> 
<body> 
    <div id="popup" class="hide"></div> 
    <input id="nearest" type="image" name="nearest" /> 
</body> 
</html> 

ちょうど私がdocument.getElementId()あなたが最初に使用を前提と機能の一部であったか、いくつかのonLoadスクリプトで囲まれ、確認のため?実際の例では、XUI ready()関数を使用して、DOMがロードされていることを確認しました。

それはまた、あなたがとにかくXUIを使用していることから、以下のコードは同等であることは注目に値します: