正確記錄jquery中兩個事件之間的時間

Question

好的。我一直在考慮這一整天，並可能失去了概述，並永遠不會提出解決方案。背景：我的腳本（下面摘錄）反覆顯示「WORD」（快速淡入，可變淡出），並記錄外觀和按鍵之間經過的時間。看到這FIDDLE

但是，我認爲我的t1和t2沒有放置/定時精確。我想要的是：它應該記錄從出現到按鍵的時間間隔，並且WORD應始終顯示1500ms（除非按鍵按下時間間隔），因此理論最大響應時間爲1499毫秒。

我懷疑我的變量randomisi是一個問題，不是嗎？我試圖考慮到這一點，但有時會得到負面反應時間。

var isi = [250, 500, 750]; var RT = []; 
var showwords = function() { 
    var randomisi = isi[Math.floor((Math.random() * isi.length))]; 

    $("#words").fadeOut(randomisi, function() { 
     $("#words").text("WORD").fadeIn(10); 
    }); 

    t1 = (new Date()).getTime(); 
}; 


INT = setInterval(showwords, 1500); 

$(document).keypress(function(e) { 
    clearInterval(INT); 
    var t2 = (new Date()).getTime(); 
    reac = t2 - t1;RT.push(reac); $("#RT").val(RT); 
    t1 = t2; 
    INT = setInterval(showwords, 1500); 
}); 

有人可以解釋這對我來說太複雜的時間問題？

Answer 1

之一三件事關閉在你的腳本似乎是這部分

$("#words").fadeOut(randomisi, function() { 
    $("#words").text("WORD").fadeIn(10); 
}); 

t1 = (new Date()).getTime(); 

.fadeOut實際上並沒有阻止腳本，所以t1被設置，即使前面的單詞淡出，給你一個大的RT值。
Relacing此代碼

$("#words").fadeOut(randomisi, function() { 
    $("#words").text("WORD").fadeIn(10, function(){ 
     t1 = (new Date()).getTime(); 
    }); 
}); 

將解決問題1

第二個問題是，它保持監聽，即使這個詞淡出KEYDOWN。您可以通過向代碼添加新的標誌來防止這種情況。

你fix1和FIX2後代碼

var isi = [250, 500, 750], 
    RT = [], 
    listen = false; 

var showwords = function() { 
    listen = false; 
    var randomisi = isi[Math.floor((Math.random() * isi.length))]; 
    $("#words").fadeOut(randomisi, function() { 
     $("#words").text("WORD").fadeIn(10, function() { 
      t1 = (new Date()).getTime(); 
      listen = true; 
     }); 
    }); 
}; 

INT = setInterval(showwords, 1500); 
$(document).keypress(function (e) { 

    if(listen == false) return; 

    clearInterval(INT); 

    var t2 = (new Date()).getTime(); 
    reac = t2 - t1; 
    RT.push(reac); 
    $("#RT").val(RT); 
    INT = setInterval(showwords, 1500); 
}); 

第三期似乎是這個詞會出現1500 - randomisi - 10毫秒，而不是正好1500毫秒。

Answer 2

唯一的原因，我可以看到其他比負時鐘偏差，可能導致t2是小於t1是，如果JavaScript實現是多線程和showwords已經被按鍵事件觸發時執行，t1由showwords後更新t2由按鍵處理程序設置，但在計算reac之前。

如果添加一個鎖變量，以消除這種可能性，你可以確認或排除這種可能性：

var isi = [250, 500, 750]; var RT = []; 
var inShowWords = 0; 
var showwords = function() { 
    inShowWords = 1; 
    var randomisi = isi[Math.floor((Math.random() * isi.length))]; 

    $("#words").fadeOut(randomisi, function() { 
     $("#words").text("WORD").fadeIn(10); 
    }); 

    t1 = (new Date()).getTime(); 
    inShowWords = 0; 
}; 


INT = setInterval(showwords, 1500); 

$(document).keypress(function(e) { 
    if (inShowWords == 0) { 
     clearInterval(INT); 
     var t2 = (new Date()).getTime(); 
     reac = t2 - t1;RT.push(reac); $("#RT").val(RT); 
     t1 = t2; 
     INT = setInterval(showwords, 1500); 
    } else { 
     RT.push('locked'); $("#RT").val(RT); 
    } 
});