举报投诉联系我们 手机版 热门标签 VUE中文网
您的位置:VUE中文网 > html input date HTML DOM Input Datetime 对象

html input date HTML DOM Input Datetime 对象

2023-06-05 14:17

html input date HTML DOM Input Datetime 对象

html input date

HTML input date 是 HTML5 中新增的一种输入类型,它可以让用户在表单中选择日期。它的语法如下:

<input type="date">

input date 元素可以使用 min 和 max 属性来限制用户可以选择的日期范围。例如:

<input type="date" min="2020-01-01" max="2020-12-31">

这样就只能在 2020 年 1 月 1 日到 12 月 31 日之间选择日期。此外,还可以使用 step 属性来限制用户只能选择特定的时间间隔,例如每隔一天、一周或一个月。例如:

<input type="date" step="7">

这样就只能在 7 天之内选择日期。此外,input date 还允许开发者使用 value 属性来设置默认值,例如:

<input type="date" value="2020-07-15">

这样就会默认显示 2020 年 7 月 15 日。此外,input date 还允许开发者使用 list 属性来显示一个下拉列表,其中包含了所有已定义的时间值。例如:

 

 <datalist id="dates"> 

 <option value="2020-07-15"> 

 <option value="2020-07-16"> 

 <option value="2020-07-17"> 

 </datalist>

这样就会显示出三个已定义的时间值 2020 年 7 月 15 日、16 日和 17 日。此外,HTML input date 还允许开发者使用 pattern 属性来限制用户所能输入的字符串格式。例如:

这样就会限制用户必须从 YYYY - MM - DD 的标准格式中选择时间值。因此,HTML input date 用于表单中是一个很好的方法来帮助用户快速、准确地选择时间值并校验数据准确性。

HTML DOM Input Datetime 对象

HTML DOM Input Datetime 对象


Input Datetime 对象

Input Datetime 对象是 HTML5 新增的。

Input Datetime 对象表示使用 type="datetime" 属性的HTML <input> 元素。

注意: Internet Explorer, Firefox, Opera 15 (及更高版本) 或 Chrome 支持 <input> 元素使用 type="datetime"。

访问 Input Datetime 对象

你可以使用 getElementById() 函数来访问使用 type="datetime" 属性的 <input> 元素:

var x = document.getElementById("myDatetime");尝试一下

提示: 你同样可以通过表单的元素集合来访问 Input Datetime 对象。

创建 Input Datetime 对象

你可以使用 document.createElement() 方法来创建使用 type="datetime" 属性的 <input> 元素:

var x = document.createElement("INPUT");
x.setAttribute("type", "datetime");尝试一下

Input Datetime 对象属性

Property 描述
autocomplete 设置或返回 datetime 字段的 autocomplete 属性值
autofocus 设置或返回 datetime 字段在页面加载后是否自动获取焦点
defaultValue 设置或返回 datetime 字段默认的值
disabled 设置或返回 datetime 字段是否被禁用
form 返回使用 datetime 字段的表单引用
list 返回包含了 datetime 字段的 datalist 引用
max 设置或返回 datetime 字段的 max 属性值
min 设置或返回 datetime 字段的 min 属性值
name 设置或返回 datetime 字段的 name 属性值
readOnly 设置或返回 datetime 字段是否只读
required 设置或返回 datetime 字段在表单中是否为必填字段
step 设置或返回 datetime 字段的 step 属性值
type 返回 datetime 字段的表单元素类型
value 设置或返回 datetime 字段的 value 属性值

标准属性和事件

Input Datetime 对象同样支持标准 属性 和 事件。


相关文章

HTML 教程: HTML 表单

HTML 参考手册: HTML <input> 标签

HTML 参考手册: HTML <input> type 属性


阅读全文
以上是VUE中文网为你收集整理的html input date HTML DOM Input Datetime 对象全部内容。
声明:本站所有文章资源内容,如无特殊说明或标注,均为采集网络资源。如若本站内容侵犯了原著者的合法权益,可联系本站删除。
相关文章
© 2024 VUE中文网 vue88.com 版权所有 联系我们