重構jQuery時間計算的建議

我對jQuery和JavaScript一般來說比較新;我有足夠的知識來編寫基本腳本，但我可以幫助優化我的一些代碼，這對我來說似乎並不高效，但我不知道改變它的最佳方式。重構jQuery時間計算的建議

我有兩個輸入類型='時間'表單字段和一個隱藏的表單字段，用於保存兩個字段之間的差異。

這裏是我的代碼：

function timeDifference(field1, field2) { 
    var field1val = $(field1).val(); 
    var field2val = $(field2).val(); 

    if ((field1val !== '--:--') && (field2val !== '--:--')) {   
     var hours = field1val.split(':')[0] - field2val.split(':')[0]; 
     var minutes = field1val.split(':')[1] - field2val.split(':')[1]; 

     minutes = minutes.toString().length<2?'0'+minutes:minutes; 
     if(minutes<0){ 
     hours--; 
     minutes = 60 + minutes; 
     } 
     hours = hours.toString().length<2?'0'+hours:hours; 

     var difference = hours + ':' + minutes; 
     return difference;   
    } else return false; 
}; 

    $('#assessmentHeaderStartTime, #assessmentHeaderEndTime').change(function() { 
    var duration = timeDifference('#assessmentHeaderStartTime','#assessmentHeaderEndTime'); 
    $('#assessmentHeaderDuration').val(duration); 
    });

我半信半疑那.change（）是去更新時間價值的最佳方式，但我不知道什麼是最佳的解決方案。我知道所有瀏覽器都不支持輸入類型='時間'，但現在Chrome瀏覽器是我們的主要焦點，它們都支持它。

我曾考慮過使用.keyup（）來計算一次用戶輸入完畢後的持續時間，但Chrome瀏覽器都提供了單擊箭頭來增加/減少時間的選項，以便您可以輸入數據幾種方法。另外，我知道這將用於平板電腦，我不確定他們用來選擇時間的時間撥號計爲點擊或按鍵。

每當用戶可以點擊並按住按鈕以將分鐘計數器從01增加到59並在每個間隔時間內調用函數時，調用該函數似乎效率不高正常使用行爲的一部分。

我不知道最佳解決方案是什麼。有沒有人有什麼建議？

來源

2013-07-29 Roy

您確定如果您點擊向上箭頭change事件被調用？從我運行的快速測試來看，它不是。

如果更改事件觸發得太多，我會建議使用onBlur，但它看起來像您擁有的代碼將按您的意願行事。有關onBlur和onChange之間的差異的更多詳細信息，請參閱this問題。

來源

2013-07-31 19:12:09 rosscj2533

是的，我相信它會改變向上的箭頭。所有3個字段位於同一頁面上，您可以在單擊箭頭更改另外兩個時間字段時看到持續時間字段更新。感謝您的鏈接，但正如您所說，它看起來像我現在得到的代碼最符合我希望它的行爲。 – Roy

重構jQuery時間計算的建議

回答

相關問題