Question

我有一个主要使用javascript的计时器，目前启动/停止功能正常。当用户点击＆＃34;停止＆＃34;按钮从#time元素获取时间，将其转换为十进制值并更新隐藏的#counter元素。例如，1个半小时将转换为1.50

我的问题是我也想让用户手动编辑时间，所以我有一个小插件，这是为了实现这个目的。

有两个问题：

如果用户通过双击元素手动添加时间并调整然后点击保存，则#counter元素不会更新，因此它将时间提交为0。
如果用户要手动设置时间然后点击“开始”按钮，则时钟从0开始，而不是从指定时间开始。

我在这里有一个JS小提琴：https://jsfiddle.net/pkj7wyLu/

在那个小提琴的JS块的底部你会看到：

//implement plugin
        $('span#time').editable().on('editsubmit', function (event, val) {
            console.log('text changed to ' + millisecondsToHours(val));
        });

我认为是每次用户手动输入时间时触发的事件。

问题：如果有人手动输入时间，它会自动使用转换后的值更新#counter字段，如果他们按下启动它会从那个时间开始？

我尝试了什么：我尝试使用format(Time)功能并让它正在尝试将值打印到控制台但我没有得到结果

Answer 1

我在clsStopwatch课程上创建了一个覆盖方法，如下所示：

this.override = function(time) {
        lapTime = time;
}

这将更新lapTime，以毫秒为单位传递时间。为此，我创建了一个接受字符串的新函数：

function stringToMilliseconds(str) {
        var a = str.split(':'); // split it at the colons
        var seconds = (+a[0]) * 60 * 60 + (+a[1]) * 60 + (+a[2]); 
        return seconds * 1000;
}

这将返回id #time元素范围内已编辑字符串的毫秒数。

最后，我更新了提交可编辑事件以调用覆盖：

$('span#time').editable().on('editsubmit', function (event, val) {
        x.override(stringToMilliseconds(val));
});

以下是更新后的JSFiddle

希望有所帮助。

JS Time Tracker未按预期工作

1 个答案: