我有一個表單，用戶可以使用輸入格式 datetime-local 設定日期和時間。提交表單時，開始日期出現錯誤“值必須為上午 11:52 或更早”。我的當地時間是 13:52。我必須選擇-2小時。我怎樣才能消除這個問題？
該表格僅限于開始日期選擇今天和過去 72 小時，結束時間相同。
<input type="datetime-local" name="start_timestamp" id="start_timestamp" required>
<input type="datetime-local" name="end_timestamp" id="end_timestamp" required>
<script>
//Do not let to select END-TIME and START TIME in the PAST
var today = new Date();
var past = new Date(today.setDate(today.getDate() - 3)).toISOString().slice(0, 16);
var today = new Date().toISOString().slice(0, 16);
document.getElementsByName("start_timestamp")[0].min = past;
document.getElementsByName("start_timestamp")[0].max = today;
</script>
<script>
var today = new Date();
var future = new Date(today.setDate(today.getDate() 3)).toISOString().slice(0, 16);
var today = new Date().toISOString().slice(0, 16);
document.getElementsByName("end_timestamp")[0].min = today;
document.getElementsByName("end_timestamp")[0].max = future;
</script>我也有一張圖片：
uj5u.com熱心網友回復：
您的問題與時區有關。因為您使用toISOString設定輸入值，所以它被設定為 UTC 日期和時間，而不是本地時間。因此，創建一個函式以正確格式回傳本地時間。
例如
// Format date as YYYY-MM-DDTHH:mm in local timezone
// to use to set min and max values for inputs
function toISOLocal(date = new Date()) {
return date.toLocaleString('sv').slice(0,-3).replace(' ','T');
}
/* Initialise date inputs to local dates ± perid in days
* Start is set to "now", end it set to now ± period
* @param {string} startID
* @param {string} endID
* @param {number} period - ±days from start to end
*/
function initialiseDateInputs(startID, endID, period) {
let startEl = document.querySelector('#' startID);
let endEl = document.querySelector('#' endID);
// Ensure elements exist
if (!startEl || !endEl) return;
// Create min and max timestamps
let d = new Date();
// Create max with zero'd seconds, milliseconds
let minD = toISOLocal(new Date(d.setSeconds(0,0)));
// Create min ±period days from max
let maxD = toISOLocal(new Date(d.setDate(d.getDate() period)));
// If period is -ve, swap max and min
if (period < 0) {
[minD, maxD] = [maxD, minD];
}
// Set element attribute values
startEl.setAttribute('max', maxD);
startEl.setAttribute('min', minD);
startEl.setAttribute('value', period < 0? maxD : minD);
endEl.setAttribute('max', maxD);
endEl.setAttribute('min', minD);
endEl.setAttribute('value', period < 0? minD : maxD);
}
// Run when elements should exist
window.onload = () => {
initialiseDateInputs('startDate', 'endDate', 3);
}.screenTip {
font-family: sans-serif;
color: #bbbbbb;
}
input {
font-size: 150%;
}<form>
<span class="screenTip">Start date and time, must be within last 3 days</span><br>
<input type="datetime-local" name="startDate" id="startDate" required><br>
<span class="screenTip">End date and time, must be within last 3 days</span><br>
<input type="datetime-local" name="endDate" id="endDate" required><br>
<input type="reset">
</form>設定輸入值屬性意味著如果輸入在一個表單中并且它被重置，它們將適當地回傳到最小值和最大值。
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/435941.html
標籤：javascript jQuery 形式 约会时间 本地日期时间