设置datetime-local的默认时间值

Question

我使用这个html标签作为日期时间选择器:

<input  type="datetime-local">

我希望能够为时间部分设置一个默认值，只有所以如果例如，如果有人插入日期而没有插入时间(将其保留为——:——:——)，那么我将能够将其设置为00:00:00。

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

有可能克服吗?或者是否有其他日期时间选择器可以用于所描述的场景?

Answer 1

我们不能改变浏览器对元素的行为。这就是第二个问题的答案这个情况是否有另一个解。我使用两个单独的date和time字段，它们控制单个datetime-local字段。

请注意，date字段没有值，除非该字段完全完成。所以我使用blur事件而不是keyup或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">

脚注1:change监听器工作在time字段(当有默认值)，但我注意到一个模糊的行为在谷歌浏览器，如果你改变时间的值由鼠标点击，改变事件后触发mouseOut !这对以上答案没有影响。

脚注2:您可以在display:nonediv中隐藏结果字段。