问答详情
源自:4-1 利用延迟和去抖技术进行优化

为什么我的setTimeout没有延迟效果啊

http://img.mukewang.com/591c12e400011b5509671047.jpg/**
* Created by Administrator on 2017/5/15.
*/
$(document).ready(function () {
   var sub = $('#sub')

   var activeRow
   var activeMenu
   
   var timer

   var mouseInSub = false

   sub.on('mouseenter',function (e) {
       mouseInSub = true
   }).on('mouseleave',function (e) {
       mouseInSub = false
   })

   $('#test')
       .on('mouseleave','li',function (e) {
           sub.addClass('none')

           if(activeRow){
               activeRow.removeClass('active')
               activeRow=null
           }

           if(activeMenu){
               activeMenu.addClass('none')
               activeMenu=null
           }
       })
       .on('mouseenter','li',function (e) {
           sub.removeClass('none')

           if(!activeRow){
               activeRow=$(e.target).addClass('active')
               activeMenu = $('#' + activeRow.data('id'))
               activeMenu.removeClass('none')
               return
           }

           timer = setTimeout(function () {
               if(mouseInSub){
                   return
               }

               activeRow.removeClass('active')
               activeMenu.addClass('none')

               activeRow = $(e.target)
               activeRow.addClass('active')
               activeMenu = $('#' + activeRow.data('id'))
               activeMenu.removeClass('none')
           },3000)

       })
});

提问者:Roarcool 2017-05-17 17:06

个回答

  • 懵逼的我
    2017-11-03 16:32:56

    https://github.com/ccccccl/JD-has-no-delayed-menu 

     代码不完全一样,根据理解实现了功能。欢迎点赞。

  • 懵逼的我
    2017-11-03 16:32:54

    https://github.com/ccccccl/JD-has-no-delayed-menu 

     代码不完全一样,根据理解实现了功能。欢迎点赞。

  • 雷灿成
    2017-05-24 21:45:35

    setInterval才是在函数外面进行调用,setTimeout要调用必须放在函数里面,这样页面加载函数时,定时器才会生效


    不知我说的对不对,自己思考一下