Question

我对jQuery和javascript相对较新;我有足够的知识来编写基本脚本，但我可以帮助优化我的一些代码，这对我来说效率似乎并不高，但我不知道改变它的最佳方法。

我有两个输入类型='时间'表单字段和一个隐藏表单字段，用于保存两个字段之间的差异。

这是我的代码：

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和＆amp; Safari是我们的主要关注点，都支持它。

我想过可能会使用.keyup（）来计算用户在一次完成输入后的持续时间，但Chrome＆amp; Safari提供了单击箭头以增加/减少时间的选项，因此您可以通过几种方式输入数据。此外，我知道这将用于平板电脑，我不确定他们用来选择时间拨号的次数是否为按键或按键。

每次进行更改时调用函数似乎效率低，例如，用户可以单击并按住按钮将分钟计数器从01增加到59并让它在每个间隔调用函数作为一部分正常使用行为

我不知道对此最佳解决方案是什么。有没有人有任何建议？

Answer 1

您是否确定如果单击向上箭头，则会调用change事件？从一个快速测试我跑它不是。

如果更改事件触发过多，我建议使用onBlur，但看起来你所拥有的代码将按照你想要的方式运行。有关onBlur和onChange之间差异的详细信息，请参阅this问题。

关于重构jQuery持续时间计算的建议

1 个答案: