mouseover action一度だけ実行する（方法）

Question

マウスが特定の領域にあるときにツールチップにデータをロードしたい（ajax経由で）。問題は、マウスがその領域にいる限り、ajax呼び出しが行われることです。私はonmouseover（アヤックスコール）efectを行うことができます何らかの方法はありますか？ .oneで

$.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

：

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

.oneとすぐにそれが実行されると、ハンドラをデタッチします。ここのコードがあります。その結果、それ以上の時間は実行されません。あなたがツールヒントが非表示になりますonMouseLeaveイベントにフック機能とともに、代わりにonMouseOverイベントのonMouseEnterイベントにあなたの関数をフックしたい場合があり

Answer 2

：

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

ノートの純粋なJSバージョンのものこれらのイベントIEは、jQueryのは、他のブラウザ

Answer 3

私はこれが話題となっているので、長い時間をされている知っているが、簡単に代替を探している人のための動作をシミュレートしています

静的変数を設定し、最後に使用した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 4

現代JSを使用してください！

node.addEventListener("mouseover", function() { 
    // Load data here 
}, {once : true}); 

Documentation 、