0

ということで、3キャラとシークレットキャラが1体。シークレット キャラクターは .chosen キャラクターである必要があります。これまでのところすべて良い。ただし、アラートを表示しようとしていますが、選択したキャラクターがシークレットキャラクターdivにあるために3秒が経過した場合のみです。現時点では、キーをすばやく押すと (シークレット キャラクターに選択したキャラクターが含まれている時間が 3 秒未満)、アラートがトリガーされます。

<div id="peter" class="chosen">peter</div>
<div id="louis">louis</div>
<div id="stewie">stewie</div>

<br><br>
<div id="secret-character"></div>

jQuery:

$(document).keydown(function(e){
if(e.keyCode==38||e.keyCode==40) {
    var prev = $('.chosen').prev();
    var next = $('.chosen').next();

    if(e.keyCode==38){
        $('.chosen').removeClass('chosen'); prev.addClass('chosen');
    }    
    if(e.keyCode==40){
        $('.chosen').removeClass('chosen'); next.addClass('chosen');
    }  

    var timeoutID = null;    

    clearTimeout(timeoutID);
    timeoutID = setTimeout(function() {alert('3 secs secret character!')}, 3e3);


    $('#secret-character').html('Secret Character:'+$('.chosen').html()+'!');                             
}
});

どんな助けでも大歓迎です。これがフィドルです：http://jsfiddle.net/58MJ3/

4

1 に答える 1

2

keydown ハンドラーが実行されるたびに、ローカル変数timeoutIDをnull次のように設定しています。

var timeoutID = null;

次に、その空のタイマーをクリアして、新しいタイマーを開始します。

timeoutID = setTimeout(function() {alert('3 secs secret character!')}, 3e3);

ただし、コールバックの実行が終了すると、それはローカル変数であるtimeoutIDため消えます。timeoutID

以前のタイマーをクリアしたいのでtimeoutID、ハンドラーへの呼び出し間で保持する必要があると思います。おそらくあなたはこれが欲しい：

var timeoutID = null;
$(document).keydown(function(e) {
    // As before except no `var timeoutID = null` in here...
});

デモ: http://jsfiddle.net/ambiguous/AjaAb/

于 2012-06-03T23:20:58.250 に答える