Question

我可以使用下面的箭头或键盘箭头轻松地阻止用户编写将来的日期，我也想防止他在输入字段中编写将来的日期。

我不想完全禁用键盘输入，因为它很有用

    document.getElementById("date_end").addEventListener("change", event => {
        if (event.target.value > event.target.max) {
            event.target.value = event.target.max;
        }
    });

<input type='date' name='date_end' id='date_end' max="2023-01-03" value="2020-01-01">

Answer 1

上面的代码片段有效，但是我最终使用了下面的代码片段，不确定为什么，使用上面的代码更好。

	const dateToDate = date => {
		let params = date.split('-');
		params[1]--; // months are zero indexed
		return new Date(...params);
	};

	let end_date_input = document.getElementById('date_end');
	end_date_input.addEventListener('input', function(){
		if(dateToDate(this.value) > dateToDate(this.max)){
			this.value = this.max;
		}
	});

    <input type='date' name='date_end' id='date_end' max="2023-01-03" value="2020-01-01">

HTML输入日期：不允许用户使用键盘输入将来的日期

1 个答案: