1

だから、私はこの種の状況を抱えていますが、ユーザーがx時間以上、たとえば1秒「マウスを離す」場合にのみ「何かをしたい」と思います。それをどのように実装すればよいですか？

$("#someElement, #someOtherElement").mouseleave(function() {
   // Do something.
});

後で追加しました：

    $('.popover3-test').popover({
        placement:'bottom',
        template: $('.popover2'),
        trigger: 'manual',

        }).mouseenter(function(e) {
        $(this).popover('show');

        $(".popover3-test, .popover2").each(function() {
            var t = null;

            $(this)
                .mouseleave(function() {
                    t = setTimeout(function() {
                        $('.popover2').hide();
                    }, 1000); // Or however many milliseconds
                })
                .mouseenter(function() {
                    if(t !== null)
                        clearTimeout(t);
                })
            ;
        });


});
4

3 に答える 3

5

setTimeoutトリックを行う必要があります：

$("#someElement, #someOtherElement").each(function() {
    var t = null;

    $(this)
        .mouseleave(function() {
            t = setTimeout(function() {
                // Do something.
            }, 1000); // Or however many milliseconds
        })
        .mouseenter(function() {
            if(t !== null) {
                clearTimeout(t);
                t = null;
            }
        })
    ;
});

編集:どちらかで動作させたい場合は、次を削除して.eachください:

var t = null;

$("#someElement, #someOtherElement")
    .mouseleave(function() {
        t = setTimeout(function() {
            // Do something.
        }, 1000); // Or however many milliseconds
    })
    .mouseenter(function() {
        if(t !== null) {
            clearTimeout(t);
            t = null;
        }
    })
;
于 2012-07-03T22:21:51.160 に答える
3 
$("#someElement, #someOtherElement").bind('mouseenter mouseleave', (function() {

    var timer;

    return function (e) {

       if(e.type === 'mouseleave') {
          timer = setTimeout(function () {
             //do something
          }, 1000);
       }  else {
          clearTimeout(timer);
       }

    };

}()));

編集-複数の要素で使用可能

$("#someElement, #someOtherElement").bind('mouseenter mouseleave', function (e) {

       var timer = $(this).data('timer');

       if(e.type === 'mouseleave') {
          timer = setTimeout(function () {
             //do something
          }, 1000);
       }  else {
          clearTimeout(timer);
       }

       $(this).data('timer', timer);    
    };

});
于 2012-07-03T22:22:24.543 に答える
2

これはそのままでは機能しないかもしれませんが、いくつかのアイデアを提供します...

var elapsed = 0;
var timer = setInterval(function(){
  elapsed += 20;
  if( elapsed >= 1000 ) {
     doSomething();
     clearInterval(timer);
  }
}, 20 );
$('#some').mouseleave(timer);
$('#some').mouseenter(function(){clearInterval(timer);elapsed=0;});
于 2012-07-03T22:22:08.980 に答える