1

ホバー時にヘルプ ヒントが表示されるまでの遅延を設定しようとしています。ただし、私が直面している問題は、ユーザーのマウスが HTML 要素に触れてすぐに移動すると、500ms が経過してもヘルプ ヒントが表示されることです。マウスが500ミリ秒ホバーした場合にのみ、ホバーチップを表示したい. 500 ミリ秒前にエリアを離れた場合、ホバー チップは表示されません。助けてください。これがコードスニペットです。hoverIntent などの既存のプラグインについて知っているわけではありませんが、機能内でかなりのカスタムを行っているため、プラグインの使用を避け、自家製のソリューションを微調整するだけです。ご提案いただきありがとうございます。

ここにコードスニペットがあります

function displayTip(displayText, displayElement)
{
 // some sanity check code here
 setTimeout(function() {introduceDelay(displayText, displayElement) } ,500);    
}

私が達成しようとしているのは、ユーザーのマウスが指定された html 要素の上に 500 ミリ秒ホバーしない場合、introduceDelay への機能呼び出しがまったく行われないことです。

4

2 に答える 2

3

からの戻り値を保存してからsetTimeout()、「mouseleave」ハンドラーで でクリアしclearTimeoutます。

var timer;
function displayTip(displayText, displayElement)
{
 // some sanity check code here
 timer = setTimeout(function() {introduceDelay(displayText, displayElement) } ,500);    
}   

// ...

$('whatever').mouseleave(function() {
  clearTimeout(timer);
});

経過時間の確認について心配する必要はありません。clearTimeout()すでに起動されているタイマー ID で呼び出しても、何も問題はありません。

于 2012-07-09T22:10:55.587 に答える
2 
var timer;

$("element").mouseenter(function(){
    timer = setTimeout(function(){
        //show help box
    }, 500);
});

$("element").mouseleave(funciton(){
    clearTimeout(timer);
});
于 2012-07-09T22:12:42.397 に答える