我希望有一个函数可以检查字段中的日期是否从过去的日期开始超过50年。如果日期超过50年,则应显示一条消息,但不应有任何最短日期(最长年限)。
我有一个表单可以动态添加更多字段(name + birthdate),并且每个新的“表单”应该在生日字段下显示此消息(如果它超过50年)。
每个生日字段下的警告消息应该是这样的(如果超过50):
<div class="alert alert-warning">This person is over 50 year. Remember to do...</div>
我的html设置:
<label for="id_nested-0-name">Name</label>
<input id="id_nested-0-name" maxlength="200" name="nested-0-name" type="text" />
<label for="id_nested-0-birthdate">Birthdate</label>
<input class="dateinput" datadatepicker="datepicker" id="id_nested-0-birthdate" name="nested-0-birthdate" type="date" />
<!-- If nested-0-birthdate is over 50, add html with warning message -->
<!-- New person -->
<label for="id_nested-1-name">Name</label>
<input id="id_nested-1-name" maxlength="200" name="nested-1-name" type="text" />
<label for="id_nested-1-birthdate">Birthdate</label>
<input class="dateinput" datadatepicker="datepicker" id="id_nested-1-birthdate" name="nested-1-birthdate" type="date" />
<!-- If nested-1-birthdate is over 50, add html with warning message -->
此代码在chrome中运行良好,但在safari中不起作用。有谁看到可能出错的地方?
<script type="text/javascript">
$(document).ready(function() {
$(function(){
$("#collapse1 input.dateinput").on("change.dp change keyup paste click propertychange",function (e){
var timediff1 = moment().diff(moment($(this).val()), 'years');
if (timediff1 >= 50 ) {
$('#alert1').remove();
$('#collapse1 .panel-body').append('<div id="alert1">Over 50!</div>');
} else {
$('#alert1').remove();
}
});
});
});
</script>
使用http://eonasdan.github.io/bootstrap-datetimepicker/作为我的日期选择器。
我的输入中缺少data-format="DD/MM/YYYY"
。现在一切正常!
答案 0 :(得分:1)
如果您不介意使用 moment.js
boolean isOldGeezer = moment().diff(moment($(this).val()), 'years') > 50;
答案 1 :(得分:0)
这个问题的三部分答案
首先你需要在50年前获得这个日期。我在这里使用一个小黑客。您可以在StackOverflow中找到更好的技术。
ago50y = new Date();
ago50y.setFullYear(ago50y.getUTCFullYear()-50);
其次,比较输入更改时的日期。以下代码使用jQuery。
$('input.dateinput').change(function (event) {
if ($(event.target).val() < ago50y.toJSON().slice(0,10)) {
$('#alert').text('This person is over 50 year. Remember to do...');
} else {
$('#alert').text('');
}
});
第三,每当添加一组新输入时,都会调用第二部分。将上面的代码放在一个函数中,并在添加新集合时将其包含在回调中。