如何显示时差javascript，HTML和CSS？ [英] How to display time difference javascript, HTML and CSS?

问题描述

JavaScript



我有两个日期时间输入字段（今天的日期和考试日期），我想在警报中显示两个用户输入之间的时差JavaScript框只有5秒钟。



到目前为止，我只能显示我的三个变量模块代码，今天的日期和考试日期。

我似乎无法使代码正确，



喜欢改变价值=2017-10-22T10：00：00到毫秒级

datetime格式让我很难转换为毫秒



我尝试过：



< form class =form>



< label>< b>模块代码< / b>< / label> ; < br>

< input id =f1name =moduletype =textautofocus required placeholder =Module Code>< br>



< label>< b>今天的日期< / b>< / label> < br>

< input name =time_starttype =datetime-localid =f2placeholder =Selectvalue =2017-10-22T10：00：00 ><峰; br>



< label>< b>考试日期< / b>< / label> < br>

< input name =time_endtype =datetime-localid =f3placeholder =Selectvalue =2017-10-30T10：00：00 ><峰; br>



< button type =submitclass =signupbtnonClick =processData（'f1'，'f2'，'f3'）>计算< ; / button>



< / form>





< br $>




函数processData（f1，f2，f3）

{

var module = document.getElementById（f1）.value;

var time_start = document.getElementById（f2）.value;

var time_end = document.getElementById（f3）.value ;

alert（模块+\ n+ time_start +\ n+ time_end）;

}

JavaScript

I have two datetime input fields (today's date and exam date) and i would like to display the time difference between the two user inputs in my alert JavaScript box for only 5 seconds.

So far i can only display my three variables module code, today's date and exam date.
I cant seem to get the code right,

like changing value="2017-10-22T10:00:00" into miliseconds
the datetime format is making it hard for me to convert to miliseconds

What I have tried:

<form class="form">

<label><b>Module Code</b></label> <br>
<input id="f1" name="module" type="text" autofocus required placeholder="Module Code"><br>

<label><b>Today's Date</b></label> <br>
<input name="time_start" type="datetime-local" id="f2" placeholder="Select" value="2017-10-22T10:00:00"><br>

<label><b>Exam's Date</b></label> <br>
<input name="time_end" type="datetime-local" id="f3" placeholder="Select" value="2017-10-30T10:00:00"><br>

<button type="submit" class="signupbtn" onClick="processData('f1','f2','f3')">Calculate</button>

</form>





function processData(f1,f2,f3)
{
var module = document.getElementById(f1).value;
var time_start = document.getElementById(f2).value;
var time_end = document.getElementById(f3).value;
alert(module + "\n" + time_start + "\n" + time_end);
}

推荐答案

使用 moment.js [ ^ ]

这篇关于如何显示时差javascript，HTML和CSS？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！