datetime-local的格式

datetime-local的格式為YYYY-MM-DDTHH:mm:ss，注意日期和時間之間有一個T，這是ISO 8601的標準

不過，在Java後端，一般都是用Date型別接收時間，然後存入資料庫。如果直接用Java的LocalDateTime接收，然後存入資料庫，資料庫會找不到和LocalDateTime型別對應的資料庫型別

這時候需要將datetime-local轉為Date型別。一種方式是在後端操作，需要在接收時間引數後進行格式轉換，似乎可行。不過實際操作來看，如果用@RequestBody接收物件型別，那麼這種方式不太可行。另一種方式就是在前端傳送JSON給伺服器之前，將之轉為Date

例項

表單

表單中的日期時間控制元件命名id為startDate，用於在指令碼中初始化該控制元件的時間，比當前時間多一個小時用於預定時間

也可以用value="YYYY-MM-DDTHH:mm:ss的格式，初始化日期時間控制元件

<form id="order">
    <table>
        <tr>
            <td>服務時間：</td>
            <td><input id="startDate" type="datetime-local" name
 
="startDate"></td>
        </tr>
        <tr>
            <td>預付款：</td>
            <td><input name="advancePayment"></td>
        </tr>
        <tr>
            <td>支付方式：</td>
            <td>
                <select name
 
="paymentMethod">
                    <option value="0">線上支付</option>
                    <option value="1">公司轉賬</option>
                </select>
            </td>
        </tr>
        <tr>
            <td>
                <button type="button" onclick="sendOrder()">新增訂單</button>
            </td>
        </tr>
    </table>
</form>

指令碼

指令碼中最開始用比當前時間多一個小時的時間初始化日期時間控制元件，注意日期和時間之間的T

然後當點選按鈕時，呼叫sendOrder()函式，先將表單中的日期時間控制元件的datetime-local的值轉為Date型別。再將表單轉為JSON傳送到後端

<script>
    //設定表單中的初始時間，比當前時間多一小時
    var now = new Date();
    now.setHours(now.getHours() + 1);
    var str = now.getFullYear() + "-" + fix((now.getMonth() + 1), 2) + "-" + fix(now.getDate(), 2) + "T" + fix(now.getHours(), 2) + ":" + fix(now.getMinutes(), 2);
    $("#startDate").val(str);

    //將日期格式化為兩位，不足補零
    function fix(num, length) {
        return ('' + num).length < length ? ((new Array(length + 1)).join('0') + num).slice(-length) : '' + num;
    }

    //傳送訂單
    function sendOrder() {
        //將datetime-local轉換為Date
        x = $("#startDate").val();
        now.setFullYear(parseInt(x.substring(0, 4)));
        now.setMonth(parseInt(x.substring(5, 7)) - 1);
        now.setDate(parseInt(x.substring(8, 10)));
        now.setHours(parseInt(x.substring(11, 13)));
        now.setMinutes(parseInt(x.substring(14, 16)));

        //獲取表單資料，並序列化
        var formData = $("#order").serializeArray();

        //將序列化資料轉為物件
        var formObject = {};
        for (var item in formData) {
            formObject[formData[item].name] = formData[item].value;
        }
        formObject.startDate = now;
        var formJSON = JSON.stringify(formObject);

        //傳送JSON到伺服器
        $.ajax({
            type: "POST",
            url: "<%=basePath%>/order/addOrder",
            contentType: "application/json",  //一定要設定這一行，很關鍵
            data: formJSON,
            datatype: "json",
            success: function (data) {
                alert(JSON.stringify(data));
            }
        });
    }
</script>