1

私は要素を持っています:

<b onclick="alert('');" onmouseover="this.style.color='red'; setTimeout('........', 1000);" onmouseout="this.style.color='';">123</b>

要素がマウスオーバーされ、1秒後にマウスカーソルがこの要素の上に留まり続けると、この要素の onclick() イベントが開始する必要があります。

つまり、 onmouseover() イベントで「..............」の代わりに何をすべきでしょうか?

4

4 に答える 4

2 
window.countdown = setTimeout(function(){this.click();}, 1000);

さらに、mouseout ハンドラーで間隔をクリアする必要があります。

clearTimeout(countdown);

要素に ID を付与し、新しいイベント登録モデルを使用するのが理想的です。

var e = document.getElementById('myelement');
e.addEventListener('click',function(){
    alert('');
});
e.addEventListener('mouseenter',function(){
    var self = this;
    this.style.color='red';
    window.countdown = setTimeout(function(){self.click();}, 1000);
});
e.addEventListener('mouseleave',function(){
    this.style.color='';
    clearTimeout(countdown);
});
于 2012-12-06T17:18:17.913 に答える
1

@Asadが言ったように、マウスアウトイベントを参照してクリアするグローバル変数として、マウスオーバーイベントの間隔を開始する必要があります。

<b onclick = "alert()"
 onmouseover = "window.countdown = setTimeout(function(){this.click();}, 1000);"
 onmouseout = "clearTimeout(countdown)">
 123
</b>
于 2012-12-06T17:37:42.463 に答える
1

追加の作業を行う必要があり、これはインライン Javascript 内ではうまく機能しません。これはすべて疑似コードなので、コピー/貼り付けはお勧めしません!

// We'll need to create an interval and store it
var timerInterval = {}
// And keep track of how many seconds have elapsed   
var timeElapsedInSeconds = 0;

function tick (){
   timeElapsedInSeconds++;
   if (timeElapsedInSeconds > 0){
       // YOUR GREAT CODE HERE
   }
   // Either way, let's be sure to reset everything.
   resetTimer();
}

function hoverOverHandler (){
   // Start our timer on hover 
   timerInterval = window.setInterval(tick, 1000);    
}

function resetTimer () {
   timeElapsedInSeconds = 0;
   window.clearInterval(timerInterval);
}

function hoverOutHandler () {
   // Kill timer on hoverout
   resetTimer();
}
于 2012-12-06T17:39:20.757 に答える
0

わかりました、私は動的IDでいくつかのトリックを行いました。これが得られたものです:

<b style="color:red;" onclick="if(this.style.color!='green'){return false;}else{this.style.color='red';} alert(this.parentNode);" onmouseover="if(this.style.color!='green'){var newID='tmpID_'+Math.floor(Math.random() * (10000000)); if(this.id==''){this.id=newID;} setTimeout('top.document.getElementById(\''+this.id+'\').onclick();',1000); this.style.color='green';}" onmouseout="this.style.color='red';">click</b>

クロスブラウザ =)

于 2012-12-06T19:36:49.273 に答える