设置datetime-local的默认时间值

I am using this html tag as a datetime picker:

我使用此html标记作为日期时间选择器：

<input  type="datetime-local">

I want to be able to set a default value for the time part only so if someone inserts a date and doesn't insert the time (leaves it as --:--:--) then I will be able to set it as 00:00:00 for example.

我希望能够仅为时间部分设置默认值，这样如果有人插入日期并且没有插入时间（将其保留为 - ： - ： - ），那么我将能够将其设置为例如00:00:00

The problem is I know only how to set the a value including both the date and time and if someone inserts only a date w/o the time I can't read that value and getting a blank value.

问题是我只知道如何设置一个值，包括日期和时间，以及是否有人只插入一个日期w / o我无法读取该值并获得空白值。

Is it possible to overcome that? or is there any other datetime picker I could use for the described scenario?

有可能克服这个问题吗？或者是否有任何其他日期时间选择器我可以用于描述的场景？

1 个解决方案

#1

We can not change the behavior of browser against an element. So this is an answer to the second question that if there is another solution for this scenario. I used two separate fields of date and time which control a single datetime-local field.

我们无法针对元素更改浏览器的行为。所以这是第二个问题的答案，如果有这种情况的另一个解决方案。我使用了两个独立的日期和时间字段来控制单个日期时间 - 本地字段。

Please note that the date filed has no value unless the field is totally completed. So I used blur event instead of keyup or change.

请注意，除非字段已完全填写，否则提交的日期没有任何价值。所以我使用模糊事件而不是键盘或更改。

$(document).ready(function(){
	var mydate,mytime,mystring;
	$("#dateField").blur(function(){
		if ($(this).val()){
		setResult();
		}
	})
	
	$("#timeField").change(function(){setResult()})
})


function setResult(){
	mydate=$("#dateField").val();
	mytime=$("#timeField").val();
	mystring=mydate +'T'+ mytime;
	document.getElementById('resultField').value=mystring;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="dateField" type="date"><input id="timeField" type="time" value="18:30">

<br>
<strong>Result</strong>:
<br>
<input id="resultField" type="datetime-local">

Footnote 1: The change listener works on time field (when has default value) but I noticed a vague behavior in google-chrome that if you change the value of time filed by mouse clicks, the change event is triggered after mouseOut! This has no effect on the answer above.

脚注1：更改侦听器在时间字段上工作（当具有默认值时）但我注意到google-chrome中的模糊行为，如果您通过鼠标单击更改时间值，则在mouseOut之后触发更改事件！这对上面的答案没有影响。

Footnote 2: You can hide the result field inside a display:none div.

脚注2：您可以在display：none div中隐藏结果字段。

#1