欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

HTML5 Input 日期選擇器詳解

  發(fā)布時間：2025-02-17 16:17:19   作者：整點薯條8   我要評論
本文介紹了HTML5InputDatePicker對象表示HTML``元素,是HTML5中的新對象,介紹了日期、周、月份、時間、日期+時間、本地日期時間等不同類型的日期選擇器，感興趣的朋友一起看看吧

HTML5 Input DatePicker 對象

  Input Date 對象表示 HTML `<input type="datetime">` 元素。

是 HTML5 中的新對象。

訪問 Input Date 對象

var x = document.getElementById("myDate");

日期（<input type="date" />）

最基本的日期選擇器，只能從日歷中選擇某個日期。

周(<input type="week" />)

選擇的不是一個日期了，而是周，請注意周數(shù)顯示的方式。

月份(<input type="month" />)

選擇的是月份，跟“date”類型比起來少了后面的日期數(shù)。

時間(<input type="time" />)

最簡單的一種顯示，沒有日歷，只能選擇時間。

日期+時間(<input type="datetime" />)

既顯示日期組件，又顯示時間，其實就是“date”類型和“time”類型的組合（已廢棄，chrome已無效，使用“datetime-local”代替）

本地日期時間(<input type="datetime-local" />)

代替"datetime"的存在

使用"datetime-local"編寫日期選擇器

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<script src="https://cdn.bootcss.com/jquery/3.5.0/jquery.js"></script>
<body>
    <label>
        <span>選擇日期</span>
        <input type="datetime-local" class="measureDate" placeholder="請選擇日期">
    </label>
    <script type="text/javascript">
        let date = new Date()
        let yyyy = date.getFullYear()
        let MM = (date.getMonth() + 1) < 10 ? ("0" + (date.getMonth() + 1)) : (date.getMonth() + 1)
        let dd = date.getDate() < 10 ? ("0" + date.getDate()) : date.getDate()
        let HH = date.getHours() < 10 ? ("0" + date.getHours()) : date.getHours()
        let mm = date.getMinutes() < 10 ? ("0" + date.getMinutes()) : date.getMinutes()
        let curDay = yyyy + '-' + MM + '-' + dd + 'T' + HH + ':' + mm;
        $('.measureDate').val(curDay)
        console.log(date)
    </script>
</body>
</html>

到此這篇關(guān)于HTML5 Input 日期選擇器的文章就介紹到這了,更多相關(guān)HTML5 Input 日期選擇器內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持腳本之家！

相關(guān)文章

最新評論