Question

当鼠标悬停在特定区域时，我想在工具提示中加载数据（通过ajax）。问题是，只要我的鼠标在该区域上，就会进行ajax调用。有什么办法，我可以让onmouseover（ajax call）效果只发生一次吗？这是代码：

$.post('calendar/event-details', {'eventId' :event.id},
            function (data){
                this.top = (ui.clientY + 15); this.left = (ui.clientX - 230);
                $('body').append( '<div id="vtip">' + data + '</div>' );
                $('div#vtip').css("top", this.top+"px").css("left", this.left+"px").fadeIn("slow");
                $('div#vtip').css("position","absolute");
                $('div#vtip').css("z-index", "+99");
            })

Answer 1

使用.one：

$('element').one('mouseover', function() { /* ajax */ });

.one将在处理程序执行后立即分离。因此，它将不再执行。

Answer 2

您可能希望将函数挂钩到onMouseEnter事件而不是onMouseOver事件，以及挂钩到隐藏工具提示的onMouseLeave事件的函数：

$('element').mouseenter(function() {
    /* Make request, show tooltip */
});
$('element').mouseleave(function() {
    /* Hide tooltip */
});

请注意，这些事件的纯JS版本仅限IE，jQuery模拟其他浏览器的行为

Answer 3

使用现代JS！

add_filter( 'woocommerce_package_rates', 'conditionally_hide_shipping_methods', 100, 2 );
function conditionally_hide_shipping_methods( $rates, $package ) {
    // HERE yours 2nd flat rate "Express Shipping" (that you never hide) in the array:
    $flat_rates_express = array( 'flat_rate:5', 'flat_rate:12', 'flat_rate:14' );

    $free = $flat2 = array();
    foreach ( $rates as $rate_key => $rate ) {
        // Updated Here To 
        if ( in_array( $rate->id, $flat_rates_express ) )
            $flat2[ $rate_key ] = $rate;
        if ( 'free_shipping' === $rate->method_id )
            $free[ $rate_key ] = $rate;
    }
    return ! empty( $free ) ? array_merge( $free, $flat2 ) : $rates;
}

Documentation，CanIUse

Answer 4

我知道它已经很长一段时间了，因为这是一个主题，但对于任何寻找简单替代方案的人来说：

设置静态变量并检查最后使用的ID。如果最后一个id是当前id，则什么都不做;下面的简单例子

var LastId = null;

function Hover(Id){
    if(Id!= LastId){
        LastId = Id;
        $(Id).hide('fast');
    }else{
      //Do nothing; this will keep the function from recalling 
    }
}

Answer 5

我猜你需要使用 onmouseenter 而不是 onmouseover 请阅读文档 here

鼠标悬停操作只运行一次（如何）

5 个答案: