javascript – Jquery中的简单测试不起作用.绿色广场没有显示

2023年11月17日 182次阅读

好吧,所以当你的鼠标在红色方块上时,绿色正方形会显示,但事实并非如此.这是代码：

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

最佳答案 在每个选择器前放一个点以形成一个类选择器：

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

您的代码可以简化为：

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

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

点赞