如何使用 JQuery 在日期时间输入中设置动态思维?
How to set a dynamic mindate in datetime input with JQuery?
我在编码方面相对较新,也许这是一个基础问题,但仍然如此。我有这个问题 - 我有 2 个日期时间输入(start_date 和 end_date)。我需要做一个限制,因为第二个日期 (end_date) 必须在第一个日期 (start_
日期)。有 4 个问题:
我在 google 中找到的所有内容都与日期选择器有关,但我没有使用。所以我需要一个日期时间输入的解决方案。
我需要一个与用户输入(开始日期)相关的动态解决方案,这意味着用户输入开始日期并且限制不允许他在开始日期之前输入结束日期。 (开始日期为最小日期)。
我所知道的所有 JavaScript 都是关于手动设置最小值的,但我需要一个动态的、与输入相关的解决方案。
不得禁用结束日期。
在这方面我不知道如何解决,所以我无法添加任何JavaScript或JQuery,只能添加html。
感谢您的帮助!
<input id="date1" type="datetime-local" name="start_date" onchange="getDDadmopMS()">Start Date <br />
<input id="date2" type="datetime-local" name="end_date" onchange="getDDadmopMS()">End Date<br />
好吧,我找到了适合我的答案。不是优雅的,而是工作的。
我使用 get.Time 函数从两个日期获取 ms 值,然后将它们作为底物。结果进入了一个新的领域。然后使用第二个函数我做了一个“if 语句”,如果差异为零或负数(意味着结束日期在开始日期之前),则会显示警报。这是代码。如果有人有更好的答案,我将不胜感激。
<input id="date1" type="datetime-local" name="start_date" onchange="getDDadmopMS()">Start Date <br />
<input id="date2" type="datetime-local" name="end_date" onchange="getDDadmopMS()">End Date<br />
<input id="diffms" type="text" readonly="true" placeholder="Date2 - Date1 in (ms)"/> Date2 - Date1 in (ms) <br />
// get Difference Date2 and Date1 in MS
function getDDadmopMS() {
let twoDate = new Date(document.querySelector('#date2').value);
console.log(document.querySelector('#date1').value);
let oneDate = new Date(document.querySelector('#date1').value);
document.querySelector('#diffms').value = twoDate.getTime() - oneDate.getTime();
}
//get Restriction
function getRestriction() {
var restrict = parseFloat($("#diffms").val());
if (restrict <=0){
alert('Date2 must be after Date1');
}
}
$(document).ready(function() {
$('#date1').blur(function(event) {
getRestriction();
});
$('#date2').blur(function(event) {
getRestriction();
});
});
我在编码方面相对较新,也许这是一个基础问题,但仍然如此。我有这个问题 - 我有 2 个日期时间输入(start_date 和 end_date)。我需要做一个限制,因为第二个日期 (end_date) 必须在第一个日期 (start_ 日期)。有 4 个问题:
我在 google 中找到的所有内容都与日期选择器有关,但我没有使用。所以我需要一个日期时间输入的解决方案。
我需要一个与用户输入(开始日期)相关的动态解决方案,这意味着用户输入开始日期并且限制不允许他在开始日期之前输入结束日期。 (开始日期为最小日期)。
我所知道的所有 JavaScript 都是关于手动设置最小值的,但我需要一个动态的、与输入相关的解决方案。
不得禁用结束日期。
在这方面我不知道如何解决,所以我无法添加任何JavaScript或JQuery,只能添加html。 感谢您的帮助!
<input id="date1" type="datetime-local" name="start_date" onchange="getDDadmopMS()">Start Date <br />
<input id="date2" type="datetime-local" name="end_date" onchange="getDDadmopMS()">End Date<br />
好吧,我找到了适合我的答案。不是优雅的,而是工作的。 我使用 get.Time 函数从两个日期获取 ms 值,然后将它们作为底物。结果进入了一个新的领域。然后使用第二个函数我做了一个“if 语句”,如果差异为零或负数(意味着结束日期在开始日期之前),则会显示警报。这是代码。如果有人有更好的答案,我将不胜感激。
<input id="date1" type="datetime-local" name="start_date" onchange="getDDadmopMS()">Start Date <br />
<input id="date2" type="datetime-local" name="end_date" onchange="getDDadmopMS()">End Date<br />
<input id="diffms" type="text" readonly="true" placeholder="Date2 - Date1 in (ms)"/> Date2 - Date1 in (ms) <br />
// get Difference Date2 and Date1 in MS
function getDDadmopMS() {
let twoDate = new Date(document.querySelector('#date2').value);
console.log(document.querySelector('#date1').value);
let oneDate = new Date(document.querySelector('#date1').value);
document.querySelector('#diffms').value = twoDate.getTime() - oneDate.getTime();
}
//get Restriction
function getRestriction() {
var restrict = parseFloat($("#diffms").val());
if (restrict <=0){
alert('Date2 must be after Date1');
}
}
$(document).ready(function() {
$('#date1').blur(function(event) {
getRestriction();
});
$('#date2').blur(function(event) {
getRestriction();
});
});