为了账号安全,请及时绑定邮箱和手机立即绑定

关于用hover()

<!DOCTYPE html>

<html>

<head>

    <script type="text/javascript" src="http://www.imooc.com/data/jquery-1.8.2.min.js"></script>        

</head>

<body>

    <div id="content">

        <ul>

            <li>语文</li>

            <li>数学</li>

            <li>英语</li>

            <li>物理</li>

            <li>化学</li>

            <li>生物</li>

        </ul>

    </div>

    <script type="text/javascript">

       (function($){

          $.extend({

              "liFocus":function(myli){

                  myli.css("background-color","#ccc");

              },              

              "liBlur":function(myli){

                  myli.css("background-color","#fff");

              }

          });    

       })(jQuery);

       

       $(function(){

           $("li").hover(

               $.liFocus($(this)),

               $.liBlur($(this))

           )

       });

    </script>

</body>

</html>


为什么实现不了这效果

正在回答

2 回答

  $(function(){

           $("li").hover(

               $.liFocus($(this)),

               $.liBlur($(this))

           )

       });

每个li元素在hover的时候都执行了,你自己扩展jquery写的两个函数,就是liFocus和liBlur,先执行liFocus,在执行liBlur,所以每次hover的时候最终显示的都是liBlur设置的背景颜色,看起来就没效果了。应该对li元素单独设置鼠标进入mousein和鼠标离开mouseout两种事件,分别执行liFocus和liBlur

0 回复 有任何疑惑可以回复我~
#1

Evanpan 提问者

hover本身就是移入移出效果啊,移入显示逗号前的,移出显示逗号后的不是吗
2016-04-06 回复 有任何疑惑可以回复我~
#2

跟往事干杯 回复 Evanpan 提问者

$("li").hover( $.liFocus($(this)), $.liBlur($(this)) ) $("li")查出来的结果是个数组吧?应该遍历? $("li").each(function(index){ 这里在给每一个li设置hover的代码? });
2016-04-06 回复 有任何疑惑可以回复我~
#3

Evanpan 提问者 回复 跟往事干杯

$("li").bind("mouseover",function(){ $.liFocus($(this)); }); $("li").bind("mouseout",function(){ $.liBlur($(this)); }); 为什么这样就不用遍历呢
2016-04-06 回复 有任何疑惑可以回复我~
#4

跟往事干杯 回复 Evanpan 提问者

$("li").hover( function1,function2 ),$.liFocus($(this))是一个function吗?它好像是一个对象
2016-04-06 回复 有任何疑惑可以回复我~
#5

Evanpan 提问者

非常感谢!
2016-04-07 回复 有任何疑惑可以回复我~
查看2条回复

(function($){

          $.extend({

              "liFocus":function(myli){

                  myli.css("background-color","#ccc");

              },              

              "liBlur":function(myli){

                  myli.css("background-color","#fff");

              }

          });    

       })(jQuery);  这里myli是代表一个li的对象吧,所以$.liFocus($(this));的$(this)要是一个li对象,而hover的时候$(this)是代表一个数组,应该是bind的方法底层帮我们遍历了,而hover并没有帮我们遍历

0 回复 有任何疑惑可以回复我~
#1

Evanpan 提问者

底层不懂啊,呜呜呜
2016-04-06 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消
jQuery基础课程
  • 参与学习       154768    人
  • 解答问题       7184    个

加入课程学习,有效提高前端开发速度

进入课程

关于用hover()

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信