我想用用户输入的值来检查日期(已打印),该值是“将来日期”或“过去日期”。
我将显示默认日期为2天,如果用户在给定的文本字段中输入1,则应显示为“ 过去”日期;或者,如果用户在提交的文本中输入3或更多,它应显示为“ 未来”
********** FIDDLE ***********
$(document).ready(function() {
var inputDate = jQuery(this).val();
var myDateNew = moment().add(2, 'days').format('MMM DD, YYYY');
jQuery('#myDate').text(myDateNew);
jQuery(document).on('keyup', '#inputDate', function () {
if ($('#inputDate').val() > myDateNew) {
jQuery('#dateCheck').text('Future');
}
else if ($('#inputDate').val() < myDateNew) {
jQuery('#dateCheck').text('Past');
}
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.3/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
Date: <span id="myDate"></span>
<br>
<input type="text" name="inputDate" id="inputDate" value="" placeholder="Enter number">
<div id="compare">
Entered date is : <span id="dateCheck"></span>
</div>
答案 0 :(得分:1)
在比较之前,您需要创建一个带有日期的矩对象
moment().add($('#inputDate').val(), 'days') > moment(myDateNew)
例如
$(document).ready(function() {
var inputDate = jQuery(this).val();
var myDateNew = moment().add(2, 'days').format('MMM DD, YYYY');
jQuery('#myDate').text(myDateNew);
jQuery(document).on('keyup', '#inputDate', function () {
var diff = moment().add($('#inputDate').val(), 'days');
if (diff > moment(myDateNew)) {
jQuery('#dateCheck').text('Future');
}
else if (diff < moment(myDateNew)) {
jQuery('#dateCheck').text('Past');
}
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.3/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
Date: <span id="myDate"></span>
<br>
<input type="text" name="inputDate" id="inputDate" value="" placeholder="Enter number">
<div id="compare">
Entered date is : <span id="dateCheck"></span>
</div>
答案 1 :(得分:1)
您的意思是这样的吗?输入数字(例如:1、2、3 ....)? 如果是这样,您只需要将输入的数字添加到当前日期,然后将其与显示的日期进行比较即可。
$(document).ready(function() {
var inputDate = jQuery(this).val();
var myDateNew = moment().add(2, 'days').format('MMM DD, YYYY');
jQuery('#myDate').text(myDateNew);
jQuery(document).on('keyup', '#inputDate', function () {
var inputDate = moment().add($('#inputDate').val(), 'days').format('MMM DD, YYYY');
if (inputDate > myDateNew) {
jQuery('#dateCheck').text('Future');
}
else if (inputDate < myDateNew) {
jQuery('#dateCheck').text('Past');
} else {
jQuery('#dateCheck').text('Present');
}
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
Date: <span id="myDate"></span>
<br>
<input type="text" name="inputDate" id="inputDate" value="" placeholder="Enter number">
<div id="compare">
Entered date is : <span id="dateCheck"></span>
</div>
否则,请检查其他人的答案,因为他们专注于日期输入。
免责声明:我对您的问题有些困惑。如果输入的内容为数字或日期,则为idd。
答案 2 :(得分:0)
这里的问题是myDateNew
变量返回一个Date
对象。 $('#inputDate').val()
返回number
。但是,按照您的问题,您只需要检查在输入字段中输入的值。我认为您想检查输入的值是大于还是小于myDateNew
对象的日期。您必须致电myDateNew.getDate()
才能返回日期。
$(document).ready(function() {
var inputDate = jQuery(this).val();
var myDateNew = moment().add(2, 'days').format('MMM DD, YYYY');
jQuery('#myDate').text(myDateNew);
jQuery(document).on('keyup', '#inputDate', function () {
if ($('#inputDate').val() > myDateNew.getDate()) {
jQuery('#dateCheck').text('Future');
}
else if ($('#inputDate').val() < myDateNew.getDate()) {
jQuery('#dateCheck').text('Past');
}
});
});
答案 3 :(得分:0)
$(document).ready(function() {
var myDateNew = moment().add(2, 'days');
$('#myDate').text(myDateNew.format('MMM DD, YYYY'));
$('#inputDate').val(myDateNew.format('L'));
var myDateNew = myDateNew.toDate();
$(document).on('keyup', '#inputDate', function () {
var inputDate = new Date($(this).val());
var text = "";
if (!inputDate || inputDate.toString() === "Invalid Date") {
text = "Enter valid date";
} else if (inputDate > myDateNew) {
text = 'Future';
} else if (inputDate < myDateNew) {
text = 'Past';
} else {
text = 'Now';
}
$('#dateCheck').text(text);
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.3/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<div>
Date: <span id="myDate"></span>
<br/>
<input type="text" name="inputDate" id="inputDate" value="" placeholder="Enter number" />
<div id="compare">
Entered date is : <span id="dateCheck"></span>
</div>
</div>