生手第一次写jquery,求大神们帮忙看一下

新手第一次写jquery,求大神们帮忙看一下

$(function () {
            $("#simg1").addClass('imghover');
            $("#simg1").mouseenter(function () {
                $(this).addClass('imghover');
                $("#simg2").removeClass('imghover');
                $("#simg3").removeClass('imghover');
                $("#bimg").attr("src", $("#simg1").attr("src"));
            });
            $("#simg2").mouseenter(function () {
                $("#simg2").addClass('imghover');
                $("#simg1").removeClass('imghover');
                $("#simg3").removeClass('imghover');
                $("#bimg").attr("src", $("#simg2").attr("src"));
            });
            $("#simg3").mouseenter(function () {
                $("#simg3").addClass('imghover');
                $("#simg2").removeClass('imghover');
                $("#simg1").removeClass('imghover');
                $("#bimg").attr("src", $("#simg3").attr("src"));
            });
        });

有3张小图片id为simg1,simg2,simg3 
一张大图片，id为bimg
要求鼠标指着小图片，显示相应的大图片。
样式是这样的
<ul>
<li>simg1</li>
<li>simg2</li>
<li>simg3</li>
</ul>
<ul>
<li>bimg<li>
</ul>
这个效果是实现了，但是这代码太坑爹了
请大神们帮我优化一下。（不修改样式） jQuery 图片 新手问题
[解决办法]
你那个真的可以执行吗，我怎么感觉你的选择器明显不太对啊

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
$("li:eq(0)").addClass('imghover');
        $("ul li").mouseenter(function (){
$("li").removeClass('imghover');
$(this).addClass('imghover'); 
 
            $("ul:eq(1) li:eq(0)").attr("src", $(this).attr("src"));
        });
})
 </script>
 <ul>
 <li>simg1</li>
 <li>simg2</li>
 <li>simg3</li>
 </ul>
 <ul>
 <li>bimg<li>
 </ul>

查看更多 下一篇