Question

为jQuery mouseover事件应用延迟尝试了hoverintent，但我想动态地执行它。

jQuery(document).on('mouseover', 'span[id^=viewLCmnt_]', function() {
    function ajaxTest();
});

我希望在完成第一次鼠标悬停事件之前添加延迟并不触发其他鼠标悬停。现在事件的触发速度非常快，看起来很奇怪。

如何在鼠标悬停事件上添加延迟或仅激发单个ajax函数。

试过这个

var delay = 1000;
var area = jQuery('span[id^=viewLCmnt_],i[id^=viewLThumb_]');
area.on( 'mouseenter', function() {
    jQuery(this).data( 'mouseIsOver', true );
});
area.on( 'mouseleave', function() {
    jQuery(this).data( 'mouseIsOver', false );
});
area.on( 'mouseover', function() {
    setTImeout( function() {
        if( area.data( 'mouseIsOver' ) ) {
            area.trigger( 'mouseoverdelay' );
        }
    }, delay );
});
area.on( 'mouseoverdelay', function() {
    lv(jQuery(this), jQuery('#site').val());
});

由以下代码解决：

var timer;
jQuery("body").on("mouseenter", "span[id^=viewLCmnt_],i[id^=viewLThumb_]", function(){
    timer = setTimeout(function () {
        lv(jQuery(this), jQuery('#site').val());
    }, 2000);
}).on("mouseleave", "span[id^=viewLCmnt_],i[id^=viewLThumb_]", function(){
    clearTimeout(timer);
});

Answer 1

var delay = 1000;

$( ... ).on({
    mouseenter : function() {
        var $area = $(this);
        $area.data( 'mouseIsOver', true );
        // Create a scope for async problems.
        (function( $areaRef ) {
            setTimeout( function() {
                if( $areaRef .data( 'mouseIsOver' ) ) {
                    $areaRef .trigger( 'mouseoverdelay' );
                }
            }, delay );
        })( $area );
    },
    mouseleave : function() {
        $(this).data( 'mouseIsOver', false );
    },
    mouseoverdelay : function() {
       // Your stuff
    }
});

PS：没试过这个。

为jQuery mouseover事件应用延迟尝试了hoverintent但我想动态地执行它

1 个答案: