JQuery mouseover和mouseout的问题！

<head>
    <title></title>
    <script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            $("div").click(function () {
                $("#ratings td").html("<img src='images/22.jpg'/>").mouseover(function () {
                    $(this).html("<img src='images/11.jpg'/>");
                    $(this).siblings().html("<img src='images/11.jpg'/>");
                    $(this).nextAll().html("<img src='images/22.jpg'/>");                });
                $("#ratings td").mouseout(function () {
                    $("#ratings td").html("<img src='images/22.jpg'/>");
                });
        });
    </script>
</head>
<body>
    <div>aa</div>
    <div>bb</div>
    <div><a href="###">百度</a></div>
    <table id="ratings" style="margin-top:50px;">
        <tr><td></td><td></td><td></td><td></td><tr>
    </table>
</body>
执行以上代码效果不能够正常显示，把执行mouseout这段去掉后就可以正常显示了，请问这个怎么解决？

解决方案 »

  1.   

    <script type="text/javascript">
            $(function () {
                $("div").click(function () {
                    $("#ratings td").html("<img src='images/22.jpg'/>").mouseover(function () {
                        $(this).html("<img src='images/11.jpg'/>");
                        $(this).siblings().html("<img src='images/11.jpg'/>");
                        $(this).nextAll().html("<img src='images/22.jpg'/>");                });
                    $("#ratings td").mouseout(function () {
                        $("#ratings td").html("<img src='images/22.jpg'/>");
                    });
                });
            });
        </script>
    少了
      

  2.   

    <span style="color: #FF0000;"> });</span>
      

  3.   

    图片没有，就用文字替代了，是有效果的，不知道是不是你要求的效果，可以说下你要求的效果是：<html>
    <head>
    <meta charset="utf-8" />
    <script type="text/javascript" src="jquery-1.8.0.js"></script>
    </head>
    <body>
    <div>aa</div>
    <div>bb</div>
    <div><a href="###">百度</a></div>
    <table id="ratings" style="margin-top:50px;">
    <tr><td></td><td></td><td></td><td></td><tr>
    </table>
    </body>
    <script type="text/javascript">
    $(function(){
    $("div").click(function () {
                    $("#ratings td").html("22").mouseover(function () {
                        $(this).html("11");
                        $(this).siblings().html("11");
                        $(this).nextAll().html("22");                });

    $("#ratings td").mouseout(function () {
                        $("#ratings td").html("22");
                    });
                    
    });
    });
    </script>
    </html>
      

  4.   

    呵 那你就把  mouseout 去掉阿 还要解决什么呢
      

  5.   

    关键是要实现mouseout了，去掉了就实现不了鼠标移开td后返回原来图片！
      

  6.   

    图片是有的，就是显示的比较混乱，要是换成html(数字)，或者.css("background","red")都是正常的！
      

  7.   

    什么乱七八糟的 他明明就是 少了个}）;你自己仔细看看  $(function () {
                $("div").click(function () {
                    $("#ratings td").html("<img src='images/22.jpg'/>").mouseover(function () {
                        $(this).html("<img src='images/11.jpg'/>");
                        $(this).siblings().html("<img src='images/11.jpg'/>");
                        $(this).nextAll().html("<img src='images/22.jpg'/>");                });
                    $("#ratings td").mouseout(function () {
                        $("#ratings td").html("<img src='images/22.jpg'/>");
                    });
            });
    这个是你的源码
     $("div").click(function (){ 是不是 没有闭合
      如果加上就可以了  我测试过了  至于你是不是比较乱 这个是你需要美化css啊
      

  8.   

    不好意思，这个是我复制的时候少了});源代码没有少，换成html(数字)，或者.css("background","red")都是正常的，就是html(<img src=""/>)有问题！