HTML DOM Input Time 对象

HTML DOM Input Time 对象表示一个类型为 Time 的 input HTML 元素。

语法

以下是语法：

创建类型为 time 的<input>

var timeObject = document.createElement(“input”);
timeObject.type = “time”;

属性

这里，“time” 可以具有以下属性：

属性	描述
autocomplete	它定义时间字段的 autocomplete 属性的值。
autofocus	它定义时间字段是否应该在初始页面加载时获得焦点。
defaultValue	它设置/返回时间字段的默认值。
disabled	它定义时间字段是否被禁用/启用。
form	它返回包含时间字段的封闭表单的引用。
max	它返回/设置时间字段的 max 属性的值。
min	它返回/设置时间字段的 min 属性的值。
name	它定义时间字段的 name 属性的值。
readOnly	它定义时间字段是否为只读。
required	它定义时间字段是否为必填字段，以便提交表单。
step	它定义时间字段的 step 属性的值。
type	它返回时间字段的表单元素类型。
value	它定义时间字段的 value 属性的值。

方法

并且，还有以下方法：

booleanValue	细节
stepDown	它定义时间字段应该减少的分钟数。
stepUp	它定义时间字段应该增加的分钟数。

示例

让我们来看一个Input Time 表单属性的示例：

实时演示

<!DOCTYPE html>
<html>
<head>
<title>Input Time form</title>
<style>
   form {
      width:70%;
      margin: 0 auto;
      text-align: center;
   }
   * {
      padding: 2px;
      margin:5px;
   }
   input[type="button"] {
      border-radius: 10px;
   }
</style>
</head>
<body>
<form id="Physics">
<fieldset>
<legend>Time-form</legend>
<label for="TimeSelect">Examination Time :
<input type="time" id="TimeSelect" value="14:00" disabled>
</label>
<input type="button" onclick="getform()" value="Which Exam?">
<div id="divDisplay"></div>
</fieldset>
</form>
<script>
   var divDisplay = document.getElementById("divDisplay");
   var inputTime = document.getElementById("TimeSelect");
   function getform() {
      divDisplay.textContent = inputTime.form.id+' exam starts from '+inputTime.value;
   }
</script>
</body>
</html>