关于JS悬停延时加载函数的问题

js悬停

解决方案 »

  1.   

    除了setTimeout，你还有神马好方法。
      

  2.   

    使用setTimeout的话，只要鼠标一晃过，隔一段时间就会加载指定的函数了，想要的是用户必须悬停700ms才加载
      

  3.   

    var clock = '';
    xxx.mouseover = function(){
        clearTimeout(clock);
        clock = setTimeout(function(){
            //.....
        },700);
    }这样不行吗
      

  4.   

    var clock = '';
    1.
    DOMObj.onmouseover = function(){
        clearTimeout(clock);
        clock = setTimeout(function(){
            //.....
        },700);
    }
    2.
    $(xxx).mouseover(function(){
        clearTimeout(clock);
        clock = setTimeout(function(){
            //.....
        },700);
    });一开始写错了
      

  5.   

    谢谢回复。但是这个版本其实只是用了jquery，和setTimeout好像没什么大的区别吧？
      

  6.   

    jQuery只不过被人封装了一下而已，还一样是JS。用下面那个var clock = '';
    $(xxx).mouseover(function(){
        clearTimeout(clock);
        clock = setTimeout(function(){
            //.....
        },700);
    });
      

  7.   

    你把要加载的函数写在setTimeout里面的匿名函数里面var clock = '';
    $(xxx).mouseover(function(){
        clearTimeout(clock);
        clock = setTimeout(function(){
            //要调用的函数写这里
        },700);
    });
      

  8.   

    var clock = '';
    $('.cover').mouseover(function(){
    clearTimeout(clock);
    clock = setTimeout(function(e){
    //要调用的函数写这里
    floatDiv(e,'cover0');
    },1000);
    });
    我就是按照你说的这么写的，鼠标晃过的时候犹如闪电一般，但还是加载了floatDiv函数
      

  9.   

    mouseout的时候你也执行一下clearTimeout(clock);
      

  10.   


    var obj = document.getElementById("txt1");
    obj.onmouseover = function(){
    obj.isOver = true;
    setTimeout(function(){
    if(!obj.isOver)
    return;
    //do sth.
    },700);
    }obj.onmouseout = function(){
    try{
    delete obj.isOver;
    }catch{
    obj.isOver = undefined;
    }
    }
      

  11.   

    button.addEventListener( 'mouseover', function(event) {
                 showClothTimer = setTimeout(function(){
                 alert(1);
                 },10000);
                    }, false );
    10秒后弹出，我试过把要执行的内容写在一个函数里面，效果和楼主遇到的情况一样，但是吧要执行的写成上面的情况就不会立即执行。
      

  12.   


    var t;
    $(function(){
            $('#test').hover(function(){
                   t = setTimeout(function(){
                          // TO DO
                   },700);
            },function(){
                   if(t) clearTimeout(t);
            })
    })
      

  13.   

    要測試用戶滑鼠是否悬停的話
    用mouseover 無解吧請改用mousemove
    且同10樓所說 
    mousemove執行時也執行clearTimeout
      

  14.   

        <html>  
        <head>  
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">  
        <script type="text/javascript">  
            var mytimer = null;  
             
            function beginEvent(){  
              mytimer = window.setTimeout("myfunc('123','456')", 500);          
            }  
          
              
          
    function cancelEvent() {  
      clearTimeout(mytimer);      
    }
      
    function myfunc(t1,t2) {  
    var d = document.getElementById("div1");  
    d.innerText = new Date();  
    clearTimeout(mytimer);  
    mytimer = null;  
    }

        </script>  
        </head>  
        <body>  
          <br/>  
          <br/>
          <div id="div1" style="position: absolute; top: 100px; left: 100px; width: 100px; height: 100px; border: 1px solid black;" onmouseover="beginEvent()" onmouseout="cancelEvent()"></div>  
        </body>  
        </html>