Jqueryの単純なテストは機能しません。緑色の四角形は表示されません

緑色の四角形はマウスが赤色の四角形の上にあるときに表示されますが、そうではありません。ここでは、コードは次のようになります。Jqueryの単純なテストは機能しません。緑色の四角形は表示されません

<html>                 
    <head>                 
     <script type="text/javascript" 
      src="jquery-1.6.2.min.js"></script> 

     <script type="text/javascript">           
     <!-- 
      $(document).ready(function() { 
       $("a").bind("mouseover", 
       function(){ 
        $("b").css("display", "block"); 
       }); 

       $("a").bind("mouseout", 
       function(){ 
        $("b").css("display", "none"); 
       }); 
      }); 
     -->         
     </script>                
     </head>                 
    <body>                 
     <div class="a" style="background-color: #ff0000; height: 50px; width: 50px;"></div> 
     <div class="b" style="display: none; background-color: #00ff00; height: 50px; width: 50px;"></div> 

    </body>                 
</html>

出典

2011-08-13 CyanPrime

クラスセレクターを形成するために、各セレクタの前にドットを置く：

$(".a").bind("mouseover", 
       function(){ 
       ...

あなたのコードはこれまで低減することができます。

$(document).ready(function() { 
    $(".a").hover(function() { 
     $(".b").toggle(); 
    }); 
});

http://jsfiddle.net/karim79/EkA6p/1/

出典

2011-08-13 06:20:15 karim79

ありがとうしてみてください。^_ ^私はそれができるようになるとすぐに受け入れます。 – CyanPrime

$（ "。a"）にする必要があります。セレクタには周期が必要です。あなたは、ID =「」そして、あなたは（「#A」）を使用していたが、ちょうど$（「A」）を実行すると、実際にすべてのリンクを選択する場合は、あなたが設定する必要が<a href="">

http://jsfiddle.net/hZL94/

出典

2011-08-13 06:21:37 Matt

、すなわちどこあなたの代わりに<div class="a">と<div class="b">の要素で、<a>と<b>要素を選択しようbecasueクラス.a.b

<script type="text/javascript">        
    $(document).ready(function() { 
     $(".a").bind("mouseover", 
     function(){ 
      $(".b").css("display", "block"); 
     }); 

     $(".a").bind("mouseout", 
     function(){ 
      $(".b").css("display", "none"); 
     }); 
    });        
</script>

出典

2011-08-13 06:21:40

はそれです。 $('a')の代わりに$('.a')です。 jsFiddleを参照してください。

$(document).ready(function() { 
    $(".a").bind("mouseover", function() { 
     $(".b").css("display", "block"); 
    }); 

    $(".a").bind("mouseout", function() { 
     $(".b").css("display", "none"); 
    }); 
});

出典

2011-08-13 06:22:57

-1

この

<html>                 
    <head>                 
     <script type="text/javascript" 
      src="http://code.jquery.com/jquery-1.6.2.min.js"></script> 

     <script type="text/javascript">           
      $(document).ready(function() { 
       $("#a").bind("mouseover", 
       function(){ 
        $("#b").css("display", "block"); 
       }); 

       $("#a").bind("mouseout", 
       function(){ 
        $("#b").css("display", "none"); 
       }); 
      });       
     </script>                
     </head>                 
    <body>                 
     <div id="a" style="background-color: #ff0000; height: 50px; width: 50px;"></div> 
     <div id="b" style="display: none; background-color: #00ff00; height: 50px; width: 50px;"></div> 

    </body>  
    </html>

出典

2011-08-13 06:25:34 virlan2004

彼らはクラスのIDではない –

Jqueryの単純なテストは機能しません。緑色の四角形は表示されません

答えて

関連する問題